我最近遇到了一个有趣的情况。我正在使用Angular v4.1.3。我有一个名为MyComponent的组件,该组件在我的AppSharedModule中声明并导出。我正在将AppSharedModule导入到主AppModule和2-3个其他功能模块中。
让我感到困惑的是我收到的错误消息(类型MyComponent是2个模块的声明的一部分:AppSharedModule和AppSharedModule )。似乎该应用程序看到了2个AppSharedModule实例。
有人看到此错误消息了吗?我想念什么吗?
这是我的代码:
AppModule:
import { NgModule, APP_INITIALIZER } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { AppRoutingModule } from './app-routing.module';
import { AppSharedModule } from './app-shared.module';
import { ConfigService } from '~/app/services/config.service';
function configServiceFactory(config: ConfigService) {
config.loadPhone();
return () => config.load();
}
//components
import { AppComponent } from '~/app/components/app.component/app.component';
import { CurrentApplicationsComponent } from '~/app/components/currentApplications.component/currentApplications.component';
@NgModule({
imports: [
AppSharedModule,
AppRoutingModule,
BrowserModule,
BrowserAnimationsModule
],
declarations: [
AppComponent,
CurrentApplicationsComponent
],
providers: [
ConfigService,
{
provide: APP_INITIALIZER,
useFactory: configServiceFactory,
deps: [ConfigService],
multi: true
},
],
exports: [
],
entryComponents: [],
bootstrap: [AppComponent]
})
export class AppModule { }
AppSharedModule:
import { NgModule, ErrorHandler } from '@angular/core';
import { HttpModule } from '@angular/http';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { BlockUIModule } from 'ng-block-ui';
import { ToastyModule } from 'ng2-toasty';
...
//helpers
import { MyComponent } from '~/app/helpers/myComponent.component';
...
@NgModule({
imports: [
CommonModule,
FormsModule,
HttpModule,
BlockUIModule,
ToastyModule.forRoot()
],
declarations: [
MyComponent,
...
],
providers: [
...
],
exports: [
CommonModule,
FormsModule,
HttpModule,
BlockUIModule,
ToastyModule,
MyComponent,
...
]
})
export class AppSharedModule { }