eckig 2 Kindermodule erben Eltern Dienstleistungen

Question

In der Führung auf https://angular.io/docs/ts/latest/guide/router.html#!#guards brechen wir verschiedene Routen in schöne mundgerechte Module .. Aber es scheint wie ein wenig Aufwand in Code jetzt, wenn für jedes Modul ich alle einschließen müssen der rel. Services, Provider und Pipes ...

Gibt ang2 die Importe an die untergeordneten Module weiter?

zB: ...

@NgModule({ 
    imports: [ 
     BrowserModule, 
     DndModule.forRoot(), 
     HttpModule, 
     FormsModule, 
     ReactiveFormsModule, 
     AppRoutingModule, 
     StoreModule.provideStore(
      StoreLoader.reducers(), 
      StoreLoader.initialState() 
     ), 
     StoreDevtoolsModule.instrumentStore({ 
      monitor: useLogMonitor({ 
       visible: BootstrapDataService.reduxStoreDebug(), 
       position: 'right' 
      }), 
     }), 
     StoreLogMonitorModule, 
     TranslateModule.forRoot({ 
      provide: TranslateLoader, 
      useFactory: (http: Http) => new TranslateStaticLoader(
       http, 
       window.crowdRoute + 'assets/i18n', 
       '.json' 
      ), 
      deps: [Http] 
     }) 
    ], 
    declarations: [ 
     //Pipes 
     SummaryPipe, 
     DateFormatPipe, 
     MomentDatePipe, 
     TimeAgoPipe, 
     SanitizeHtml, 
     SafePipe, 
     ValuesPipe, 
     DisplayNamePipe, 
     UserHasPermissionPipe, 
     UserHasRolePipe 
    ], 
    bootstrap: [CrowdComponent], 
    providers: [ 
     BootstrapDataService, 
     CommentService, 
     Helpers, 
     ImageService, 
     ProjectService, 
     SuggestionService, 
     AuthService, 
     AuthResolver, 
     { 
      provide: APP_BASE_HREF, 
      useValue: window.crowdRoute 
     }, 
     { 
      provide: Http, 
      useFactory: (xhrBackend: XHRBackend, requestOptions: RequestOptions, router: Router) => new CrowdHttp(xhrBackend, requestOptions, router, null), 
      deps: [XHRBackend, RequestOptions, Router] 
     }, 
     { 
      provide: BrowserXhr, 
      useClass: CrowdBrowserXHR 
     } 
    ] 
}) 
export class CrowdModule {} 

Im Augenblick ist die App nicht-Module für die einzelnen Bereiche aufgeteilt hat .. so jetzt alle Anbieter etc. werden durch den Rest der App übergeben.

Aber ... aus dem Ang2 Plunker https://angular.io/resources/live-examples/router/ts/plnkr.html:

@NgModule({ 
    imports: [ 
    BrowserModule, 
    FormsModule, 
    HeroesModule, 
    LoginRoutingModule, 
    AppRoutingModule 
    ], 
    declarations: [ 
    AppComponent, 
    LoginComponent 
    ], 
    providers: [ 
    DialogService 
    ], 
    bootstrap: [ AppComponent ] 
}) 
export class AppModule { 
} 

Der Haupt app.module.ts umfasst Module, die sich ihre eigenen Routing gehören usw.

Answer 1

Ich kenne keine Möglichkeit, die Einfuhr aus einem der Weitergabe Elternmodul zu Kindmodulen.

Obwohl Angular 2 eine Möglichkeit bietet, gemeinsame Importe zwischen mehreren Modulen zu teilen und den Boilerplate mit einem SharedModule zu reduzieren. Siehe: https://angular.io/styleguide#04-10

Etwas wie:

@NgModule({ 
    exports: [ 
    BrowserModule, 
    DndModule.forRoot(), 
    HttpModule, 
    FormsModule, 
    ReactiveFormsModule, 
    AppRoutingModule, 
    StoreModule.provideStore(
     StoreLoader.reducers(), 
     StoreLoader.initialState() 
    ), 
    StoreDevtoolsModule.instrumentStore({ 
     monitor: useLogMonitor({ 
      visible: BootstrapDataService.reduxStoreDebug(), 
      position: 'right' 
     }), 
    }), 
    SummaryPipe, 
    DateFormatPipe, 
    MomentDatePipe, 
    TimeAgoPipe, 
    SanitizeHtml, 
    SafePipe, 
    ValuesPipe, 
    DisplayNamePipe, 
    UserHasPermissionPipe, 
    UserHasRolePipe 
    StoreLogMonitorModule, 
    TranslateModule.forRoot({ 
     provide: TranslateLoader, 
     useFactory: (http: Http) => new TranslateStaticLoader(
      http, 
      window.crowdRoute + 'assets/i18n', 
      '.json' 
     ), 
     deps: [Http] 
    })] 
}) 
export class SharedModule { 
    static forRoot(): ModuleWithProviders { 
    return { 
     ngModule: SharedModule, 
     providers: [ 
      BootstrapDataService, 
      CommentService, 
      Helpers, 
      ImageService, 
      ProjectService, 
      SuggestionService, 
      AuthService, 
      AuthResolver, 
      { 
       provide: APP_BASE_HREF, 
       useValue: window.crowdRoute 
      }, 
      { 
      provide: Http, 
       useFactory: (xhrBackend: XHRBackend, requestOptions: RequestOptions, router: Router) => new CrowdHttp(xhrBackend, requestOptions, router, null), 
       deps: [XHRBackend, RequestOptions, Router] 
      }, 
      { 
       provide: BrowserXhr, 
       useClass: CrowdBrowserXHR 
      } 
      ]] 
     }; 
    } 
} 

Und dann in Ihrem Kind und Hauptmodulen alles, was Sie importieren müssen, ist, dass SharedModule und spezifische (nicht üblich) Importe für Ihre Module.

@NgModule({ 
    imports: [ 
     , SharedModule] 
     ... Other code 
    }) 
export class MyModule { } 

Sie können eine gute Umsetzung dieser im Winkelsaatgutprojekt sehen: https://github.com/mgechev/angular-seed/blob/master/src/client/app/shared/shared.module.ts