Блог

Я сделал SharedModule . Вот SharedService и он импортирован в мой app.module.ts .

У меня много лениво загруженных модулей, и я использую SharedService их для отправки данных в HeaderModule компонент другого модуля.

Но он работает только на некоторых модулях. Что произошло?

Моя проблема SharedService EventEmitter в том, что он работает над модулем dashboard. dashboardModule компоненты so доступны для приема при 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]
    }
  }
}
 

shared.service.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 { }
 

dashboard.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 { }
 

Заранее благодарю вас.

Решено.

Один из импортированных модулей RealtimeModule , который был SharedService у поставщика…

Это была моя ошибка.

Я не думаю, что у кого-то будет такая же основная проблема, как у меня, если у вас такая же проблема со мной, SharedModule(SharedService) необходимо импортировать или определять поставщика только в корневом модуле.