Angular2，包含組件模塊而不是所有組件分開

我想將多個組件綁定到一個模塊（Widget1Module）中，然後將該模塊注入到另一個模塊（AdminModule）中，使AdminModule中的所有組件都可以訪問組件Widget1Module。Angular2，包含組件模塊而不是所有組件分開

我想這樣做是爲了避免AdminModule中的declarations數組變得越來越大並且難以管理，請參閱下面的內容以更深入地解釋我的問題。

我有一個模塊文件像這樣：

import { CommonModule } from '@angular/common'; 
import { RoutingModule } from './admin-routing.module'; 

import { Declaration1 } from "./declaration1.component"; 
import { Declaration2 } from "./declaration2.component"; 
import { Declaration3 } from "./declaration3.component"; 

    @NgModule({ 
    imports: [ 
     CommonModule, 
     RoutingModule, 

    ], 
    declarations: [ 
     Declaration1, 
     Declaration2, 
     Declaration3, 
    ] 
    }) 

export class AdminModule {}

我想創建一個組件，可以內任何「聲明」模塊被使用（Widget1Component）。我知道我可以做這樣的事情：

import { CommonModule } from '@angular/common'; 
import { RoutingModule } from './admin-routing.module'; 

import { Declaration1 } from "./declaration1.component"; 
import { Declaration2 } from "./declaration2.component"; 
import { Declaration3 } from "./declaration3.component"; 

import { Widget1 } from "./widget1.component"; 

    @NgModule({ 
     imports: [ 
      CommonModule, 
      RoutingModule, 

     ], 
     declarations: [ 
      Declaration1, 
      Declaration2, 
      Declaration3, 
      Widget1 
     ] 
     }) 

    export class AdminModule {}

這將工作，但因爲這個應用程序的增長，我希望能夠將所有部件捆綁到另一個模塊，然後注入該模塊在此模塊中，像這樣：

import { CommonModule } from '@angular/common'; 
import { RoutingModule } from './admin-routing.module'; 

import { Declaration1 } from "./declaration1.component"; 
import { Declaration2 } from "./declaration2.component"; 
import { Declaration3 } from "./declaration3.component"; 

import { Widget1Module } from "./widget1.module"; 

    @NgModule({ 
     imports: [ 
      CommonModule, 
      RoutingModule, 
      Widget1Module 
     ], 
     declarations: [ 
      Declaration1, 
      Declaration2, 
      Declaration3 
     ] 
     }) 

    export class AdminModule {}

但是，當我嘗試做這樣的事情，我不斷收到錯誤，應用程序並不知道包含在Widget1Module小部件。

來源

2016-11-04 Gerard Simpson

使用'NgModule'的'exports'屬性？ –

在你Widget1Module你需要出口要在AdminModule使用，例如組件：

import { CommonModule } from '@angular/common'; 
import { Widget1Component } from "./widget1.component"; 

@NgModule({ 
    imports: [ CommonModule ], 
    declarations: [ Widget1Component ], 
    exports: [ Widget1Component ] 
    }) 

export class Widget1Module {}

這樣，當您導入Widget1Module在AdminModule，Widget1Component將可用。

來源

2016-11-04 01:19:59

Angular2，包含組件模塊而不是所有組件分開

回答

相關問題