无法解析 ApplicationModule 的参数:(?) [英] Cannot resolve parameters for 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: (?).
调试给了我很少的想法..似乎问题与具有空依赖关系的 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 升级到 angular 7.转到:https://update.angular.io/ 了解如何从任何版本升级到另一个版本
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)中的冲突发生在加载应用程序之前的 angular 编译器中，因此在 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 kiosk 获得节点功能，这将非常有用.如果不需要，只需删除 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屋！
