与SharedModule的Angular2依赖注入错误

时间:2016-11-17 10:29:21

标签: angular typescript dependency-injection angular2-services

我编写了一个SharedModule来跨多个模块共享公共管道,指令和组件。现在我必须将一个组件移动到SharedModule,以便在多个模块中使用它,这些模块也会注入一个服务。

这是我得到的错误:

  

EXCEPTION:未捕获(承诺):错误:无法解析ChooseArticleModalComponent的所有参数:( Http,?)。

该组件在其他模块中在SharedModule外注入的服务正常工作。

我要注入的服务是在AppModule(根模块)中定义的,所以根据我的理解,它应该是我的应用程序中的全局可用。

article.service.ts

import { Injectable } from '@angular/core';
import { Article, ProductCategorie } from '../_models/index';
@Injectable()
export class ArticleService {
    getAllProduktCategoriesForArticles(articles: Article[]): ProductCategorie[] {
        …
        return productCategories;
    }
}

shared.module.ts

import { ChooseArticleModalComponent } from '../inquiry/inquiry-create-choose-articles/choose-article-modal/choose-article-modal.component.ts';
…
@NgModule({
    imports: [
…
    ],
    declarations: [
…
        ChooseArticleModalComponent,
    ],
    exports: [
…
        ChooseArticleModalComponent
    ],
})
export class SharedModule {
}

app.module.ts

import { NgModule, ApplicationRef, ViewContainerRef } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
…
import { ArticleService } from './_services/article.service';

@NgModule({
  bootstrap: [AppComponent],
  declarations: [
    AppComponent,
    ErrorComponent
  ],
  imports: [ 
    BrowserModule,
    RouterModule.forRoot(ROUTES, { useHash: true }),
  ],
  providers: [ 
    ArticleService,
    …
  ]
})
export class AppModule {
…
}

选择-物品modal.component.ts

import { Component, ViewChild, OnInit, Input, Output, EventEmitter, Inject } from '@angular/core';
import { Http } from '@angular/http';

import { ArticleService } from '../../../_services/index';

@Component({
  selector: 'choose-article-modal',
  templateUrl: './choose-article-modal.template.html',
})
export class ChooseArticleModalComponent {
…
  constructor(private http: Http, private articleService: ArticleService) {
…
  }
…
}

我注入Http服务只是为了测试角度服务是否有效并且它们似乎被正确注入。

需要修改哪些内容才能解决此问题?

我正在使用angular2 final

除了SharedModule之外的所有模块都是这样导入的:

export const ROUTES: Routes = [ {
    path: 'app',   loadChildren: () => System.import('./layout/layout.module')}
}];

0 个答案:

没有答案