角度2兒童模塊繼承父服務

在下面的指南https://angular.io/docs/ts/latest/guide/router.html#!#guards我們正在分解成不同的路由成好的一口大小的模塊..但它似乎是一個代碼開銷現在如果每個模塊我需要包括所有rel。服務，供應商和管道......角度2兒童模塊繼承父服務

是否ang2傳遞到兒童模塊的進口？

如： ...

@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 {}

現在的應用還沒有分手模塊爲每個區域..所以，現在所有的供應商等通過應用程序的其餘部分通過。

但是......從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 { 
}

主要app.module.ts包括模塊，其本身包括自己的路由等

來源

2016-11-22 John

我不知道從路過的進口任何方式父模塊添加到子模塊。

儘管Angular 2有一種方法可以在多個模塊之間共享公共導入並使用SharedModule減少樣板。請參閱： https://angular.io/styleguide#04-10

喜歡的東西：

@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 
      } 
      ]] 
     }; 
    } 
}

然後在你的孩子和主要模塊都需要導入的是SharedModule和具體的（不常見），進口的模塊。

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

你可以看到一個很好的實現這一點的角度種子工程：https://github.com/mgechev/angular-seed/blob/master/src/client/app/shared/shared.module.ts

來源

2016-11-22 18:28:03 stp18

角度2兒童模塊繼承父服務

回答

相關問題