无法解析ApplicationModule的参数:(?) [英] Cannot resolve parameters for ApplicationModule: (?)

查看:67
本文介绍了无法解析ApplicationModule的参数:(?)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

Angular的新手. 我的应用程序包含1个服务和3个组件.编译成功. 我收到此错误,不知道出了什么问题:

Pretty new to Angular. My app contains 1 service and 3 components. Compiled successfully. I'm getting this error and have no idea what went wrong:

未捕获的错误:无法解析ApplicationModule的所有参数:(?).

Uncaught Error: Can't resolve all parameters for ApplicationModule: (?).

调试给了我很少的主意.看来,这个问题与具有null依赖项的NSLocaleLocalizations有关(如果可以的话)-请参见下面的屏幕截图:

Debugging gave me very little idea.. It seems that the issue is related to NSLocaleLocalizations having null dependencies (if that makes sense) - see screenshot below:

这是一些代码: 请让我知道是否还有其他需要. 非常感谢您的帮助-非常感谢.

Here is some code: Please let me know if anything else is needed. Your help is much appreciated - thank you very much.

package.json

{
  "name": "angular_app",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "build-aot": "ng build --prod --aot",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
  "@angular/animations": "^6.0.0",
  "@angular/cdk": "^6.0.0",
  "@angular/common": "^6.0.0",
  "@angular/compiler": "^6.0.0",
  "@angular/core": "^6.0.0",
  "@angular/forms": "^6.0.0",
  "@angular/http": "^6.0.0",
  "@angular/material": "^6.0.0",
  "@angular/platform-browser": "^6.0.0",
  "@angular/platform-browser-dynamic": "^6.0.0",
  "@angular/router": "^6.0.0",
  "core-js": "^2.5.4",
  "express": "^4.16.4",
  "rxjs": "^6.0.0",
  "zone.js": "^0.8.26"
  },
  "devDependencies": {
  "@angular/compiler-cli": "^6.0.0",
  "@angular-devkit/build-angular": "~0.6.0",
  "typescript": "~2.7.2",
  "@angular/cli": "~6.0.0",
  "@angular/language-service": "^6.0.0",
  "@types/jasmine": "~2.8.6",
  "@types/jasminewd2": "~2.0.3",
  "@types/node": "~8.9.4",
  "codelyzer": "~4.2.1",
  "jasmine-core": "~2.99.1",
  "jasmine-spec-reporter": "~4.2.1",
  "karma": "~1.7.1",
  "karma-chrome-launcher": "~2.2.0",
  "karma-coverage-istanbul-reporter": "~1.4.2",
  "karma-jasmine": "~1.1.1",
  "karma-jasmine-html-reporter": "^0.2.2",
  "protractor": "~5.3.0",
  "ts-node": "~5.0.1",
  "tslint": "~5.9.1"
  }

}

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { HttpModule } from '@angular/http';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';

import { StoriesComponent } from './pages/stories/stories.component';
import { StoryComponent } from './pages/story/story.component';
import { StageComponent } from './pages/stage/stage.component';

@NgModule({
declarations: [
  AppComponent,
  StoryComponent,
  StoriesComponent,
  StageComponent
],
imports: [
  BrowserModule,
  AppRoutingModule,
  HttpModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }

app-routing.module.ts

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { StoriesComponent } from './pages/stories/stories.component';
import { StoryComponent } from './pages/story/story.component';
import { StageComponent } from './pages/stage/stage.component';

const routes: Routes = [
  {path: '', redirectTo: '/stories', pathMatch: 'full'},
  {path: 'stories', component:StoriesComponent},
  {path: 'stories/:id', component: StoryComponent},
  {path: 'stories/:id/:id', component: StageComponent}
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

stories.service.ts

import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import { map, tap } from 'rxjs/operators';

import { BehaviorSubject } from 'rxjs';

@Injectable({
  providedIn: 'root'
})

export class StoriesService {


  private _stories = new BehaviorSubject<any>(null);
  public stories = this._stories.asObservable();


  storyIdCounter = 0;
  stageIdCounter = 0;
  stateIdCounter = 0;

  constructor(private http: Http) { 
    this.getStoriesForReal().subscribe(
      (stories) => {
        console.log(stories);
        this._stories.next(stories);
      });
  }

  getStoriesForReal() {
    return this.http.get("http://localhost:3001/test").pipe(
      tap(res => console.log(res)),
      map((response) => response.json())
    );
  }

}

stories.component.ts

import { Component, OnInit } from '@angular/core';
import { Story } from '../../interfaces/story';
import { StoriesService } from '../../services/stories.service';


@Component({
  selector: 'app-stories',
  templateUrl: './stories.component.html',
  styleUrls: ['./stories.component.scss']
})
export class StoriesComponent implements OnInit {

  id = 0;
  storiesList: Story[];

  constructor(
    private storiesService: StoriesService) { 
    }

  ngOnInit() {
    this.storiesList = [];
    this.storiesService.stories.subscribe((stories) => {
      for (let story in stories) {
        this.storiesList.push(stories[story]);
      }
    });
  }  
}

story.component.ts

import { Component, OnInit } from '@angular/core';
import { StoriesService } from '../../services/stories.service';


@Component({
  selector: 'app-story',
  templateUrl: './story.component.html',
  styleUrls: ['./story.component.scss']
})
export class StoryComponent implements OnInit {

  constructor(
    private storiesService: StoriesService
  ) { 

  }

  ngOnInit() {

  }
}

stage.component.ts

import { Component, OnInit } from '@angular/core';

import { StoriesService } from '../../services/stories.service';

@Component({
  selector: 'app-stage',
  templateUrl: './stage.component.html',
  styleUrls: ['./stage.component.scss'],
})
export class StageComponent implements OnInit {

  constructor(
    private storiesService: StoriesService
  ) { }


  ngOnInit() {

  }
}

推荐答案

我得到这个的原因是我不正确地从Angular 5.2升级到Angular7.请转到:

The reason I got this is that I improperly upgraded from angular 5.2 to angular 7. Go to: https://update.angular.io/ to know how to upgrade from ANY version to another

还要查看此 https://github.com/nwjs/nw.js/issues/6804 ,如果您使用的是NWJS,则为解决方案

Also look at this https://github.com/nwjs/nw.js/issues/6804 which is a solution if you are using NWJS

对于使用NWJS和Angular 6并需要像我一样的Node功能的任何人,在@rogerwang将我引到此链接之后,我都可以纠正此问题.但是,如果需要沿侧面角度使用Node功能,则最肯定的建议可能行不通.在加载应用程序之前,在角度编译器中会发生两个Node REQUIRE定义(Angular 6和NWJS)中的冲突,因此通常将脚本添加到index.html文件或polyfill.ts中不会解决此问题.要解决此问题,请在您的nw清单中,不要删除node-remote字段或nodejs标志,不要添加新的字段bg-script并通过上面链接中指定的解决方法表达式传递js文件.在Angular应用中,在nw对象中重新分配require函数.解决了.参见下面的示例

For any one who uses NWJS with Angular 6 and requires Node capabilities like i do, i was able to rectify this after @rogerwang referred me to this link. However, the suggestions there most certainly may not work if Node functionality is required along side angular; the conflict in both Node REQUIRE definitions (Angular 6 and NWJS) occurs in the angular compiler prior to loading the app so adding the script in your index.html file or polyfill.ts ordinarily will not rectify the issue. To solve this, in your nw manifest, do not remove the node-remote field or nodejs flag, add a new field bg-script and pass a js file with the workaround expressions specified in the link above. In your Angular app, re assign the require function in your nw object. That solves it. See Example below

removeRequire.js

removeRequire.js

window.requireNode = window.require;
window.require = undefined;

NW package.json

NW package.json

{"name": "angular-app",
  "version": "0.0.0",
  "main": "http://localhost:4200/",
  "node-remote": "http://localhost:4200",
  "bg-script": "removeRequire.js",
  "window": {
    "toolbar": false,
    "title": "App",
    "width": 550,
    "height": 870
  },
  "scripts": {
    "start": "nw ."
  }
}

Angular 6应用程序polyfill.ts

Angular 6 app polyfill.ts

declare var nw: any;
const isNWjsAvailable = typeof (nw) === 'object';

(function(inkioskMode: boolean) {
    if (inkioskMode) {
        nw.require = nw.global.require =  nw.global.requireNode;
        nw.global.requireNode = undefined;
    }
}(isNWjsAvailable));

注意 如果您需要通过nw信息亭提供节点功能,这将很有用.如果不需要它,只需删除node-remote字段即可.另外,为bg-script字段提供的脚本应与您的nw清单位于同一文件夹中.如果构建或服务AOT,也可能不需要它.

Note This is useful if you require node capabilities through the nw kiosk. If It isnt needed, just simply remove the node-remote field. Also, the script provided for the bg-script field should be in the same folder as your nw manifest. It may also not be needed if building or serving AOT.

这篇关于无法解析ApplicationModule的参数:(?)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆