2017-08-20 14 views
0

多くのモジュールでディレクティブ/コンポーネントを宣言できますか? 私は一つだけエクスポートすることができます。定義モジュール内のディレクティブまたはコンポーネントの宣言、角4

import { Directive, ElementRef } from '@angular/core'; 
 

 
@Directive({ selector: '[appBigText]' }) 
 
export class BigTextDirective { 
 
    constructor(el: ElementRef) { 
 
    el.nativeElement.style.fontSize = '100px' 
 
    } 
 
} 
 

 

 
module one: 
 

 
import { BigTextDirective } from '../common/directives/dir225'; 
 
@NgModule({ 
 
    imports: [HttpModule........... 
 
    
 
    providers :[homeService], 
 
    declarations: [ 
 
    HomeComponent, 
 
    DetailComponent, 
 
    BigTextDirective 
 
    ] 
 

 
component: 
 
import { BigTextDirective } from '../common/directives/dir225'; 
 

 
@Component({ 
 
    selector: 'my-app', 
 
    template: ` 
 
<router-outlet></router-outlet> 
 
    <div appBigText>This text is huge.</div>. 
 
    ` 
 
}) 
 

 
module two is same inculding, but i have error
エラー:HomeModuleとNotesModule: タイプBigTextDirectiveは2つのモジュールの宣言の一部です! BigTextDirectiveをHomeModuleとNotesModuleをインポートする上位モジュールに移動することを検討してください。また、BigTextDirectiveをエクスポートして含める新しいNgModuleを作成し、そのNgModuleをHomeModuleおよびNotesModuleにインポートすることもできます。

答えて

2

複数のモジュールで同じコンポーネント/ディレクティブを使用する必要がある場合は、一般的なことを意味します。では、なぜエラーの提案に従わずにBigTextDirectiveをモジュールを分離してエクスポートするのですか?

NgModule({ 
    // ... 
    providers: [ 
    BigTextTexture 
    ] 
    exports: [ 
    BigTextTexture 
    ] 
}) 
export class CommonModule {} 

だから、簡単にそれをインポートすることにより、高レベルのモジュールでそれを再使用することができます。

@NgModule({ 
    imports: [ 
    CommonModule 
    ], 
    declaration: [ 
    INeedBigTextTextureComponent 
    ] 
}) 
export class HighLevelModule {} 

は角度がコード組織であなたを助けましょう!

関連する問題