angular - Angular EventEmitter 不适用于某些延迟加载的模块

问题描述

我做了SharedModule。这是SharedService，它已导入我的app.module.ts.

我有许多延迟加载的模块，我SharedService用来将数据从另一个模块的组件发送HeaderModule 到另一个模块的组件。

但它仅适用于某些模块。发生了什么？

我的问题是SharedService正在EventEmitter处理仪表板模块。sodashboardModule的组件在headerComponent通过发射数据时可以接收sharedservice。但它不适用于实时模块的组件。

这是我的代码。

app.module.ts

@NgModule({
  declarations: [AppComponent, MainComponent],
  imports: [
    BrowserModule,
    AppRouting,
    HttpClientModule,
    UiModule,
    FormsModule,
    BrowserAnimationsModule,
    SharedModule.forRoot()
  ],
  providers: [
    { provide: LocationStrategy, useClass: HashLocationStrategy }
  ],
  bootstrap: [AppComponent],
})
export class AppModule {}

shared.module.ts

@NgModule({
  imports: [
    CommonModule
  ],
  declarations: []
})
export class SharedModule {
  static forRoot(): ModuleWithProviders {
    return {
      ngModule: SharedModule,
      providers: [SharedService]
    }
  }
}

共享服务.ts

@Injectable({
  providedIn: 'root'
})
export class SharedService {
    public themeEmitter: EventEmitter<any> = new EventEmitter<any>();
    constructor(private http: HttpClient) {
    }

    changeTheme(event: any) {
        this.themeEmitter.emit(event);
    }
    onChangeTheme(subscribeFunc: any) {
        return this.themeEmitter.subscribe(subscribeFunc);
    }
}

ui.module.ts

@NgModule({
    declarations: [
    ],
    imports: [
        HttpClientModule,
        CommonModule,
        HeaderModule,
        LoginModule
    ],
    exports: [
        LoginModule,
        HeaderModule
    ],
    providers: [
        WebsocketService
    ]
})
export class UiModule { }

仪表板.lazy.module.ts

export function createTranslateLoader(http: HttpClient) {
    return new TranslateHttpLoader(http, './assets/i18n/', '.json');
}

@NgModule({
    imports: [
        CommonModule,
        DashboardRouting,
        HttpClientModule,
        TranslateModule.forRoot({
            loader: {
                provide: TranslateLoader,
                useFactory: (createTranslateLoader),
                deps: [HttpClient]
            },
            isolate: true
        }),
    ],
    exports: [
        TranslateModule
    ],
    declarations: [
        DashboardComponent,
        ...
    ],
    entryComponents: [
         ...
    ],
    providers: [
        DashboardService,
        BackendProvider
    ]
})
export class DashboardModule { }

realtime.lazy.module.ts

export function createTranslateLoader(http: HttpClient) {
    return new TranslateHttpLoader(http, './assets/i18n/', '.json');
}

@NgModule({
    imports: [
        CommonModule,
        TreeModule,
        MonitoringRouting,
        TranslateModule.forRoot({
            loader: {
                provide: TranslateLoader,
                useFactory: (createTranslateLoader),
                deps: [HttpClient]
            },
            isolate: true
        })
    ],
    declarations: [
           ...
    ],
    providers: [
        RealtimeService
    ]
  })
  export class RealtimeModule { }

先感谢您。

标签： angular

angular - Angular EventEmitter 不适用于某些延迟加载的模块

问题描述

解决方案

推荐阅读