2016-10-07 12 views
10

だから私は、角2最終(2.0.0)を使用してのは、私は私が自分のアプリケーションの構築を支援しますディレクティブやコンポーネントの束とWidgetsModuleを作成し、私のAppModuleにAngular2で別のモジュールからモジュールを継承する方法は?

import { NgModule }  from '@angular/core'; 
import { UniversalModule } from 'angular2-universal'; 

import { WidgetsModule } from '../../../widgets'; 
import { App, appRouting } from './'; 

@NgModule({ 
    imports:  [ 
    UniversalModule, 
    WidgetsModule, 
    appRouting 
    ], 
    providers: [ AppPresenter ], 
    declarations: [ App ], 
    exports:  [ ], 
    bootstrap: [ App ] 
}) 
export class AppModule { } 
それをインポートするとしましょうよ

次に、私はHomeModule、CartModuleなどの子モジュールでウィジェットを使いたいと思います。他のすべてのモジュールでWidgetsModuleをインポートせずにウィジェットを使用できるようにするにはどうすればいいですか?

import { NgModule }  from '@angular/core'; 
import { CommonModule } from '@angular/common'; 
import { FormsModule, ReactiveFormsModule } from '@angular/forms' 

import { WidgetsModule } from '../../../widgets'; 
import { Cart, cartRouting } from './'; 

@NgModule({ 
    imports:  [ 
    CommonModule, 
    FormsModule, 
    ReactiveFormsModule, 
    WidgetsModule, //<-- I want to avoid doing this in every module 
    cartRouting 
    ], 
    providers: [ ], 
    declarations: [ Cart ] 

}) 
export class CartModule { } 

エクスポート[]内のディレクティブで行われているように行う方法はありますか?

答えて

11

をビスト。しかし、それをきれいにする1つの方法は、から複数の場所で使用されるすべてのモジュールをエクスポートすることです。次に、あなたはちょうどあなたがそれらの他のモジュールのいずれかを使用していますSharedModuleでコンポーネントを宣言していると言う場合を除きSharedModuleはどこにでも

@NgModule({ 
    exports: [ 
    FormsModule, 
    CommonModule, 
    WidgetsModule 
    ] 
}) 
class SharedModule {} 

あなたはSharedModuleimportsそれらのいずれかにする必要はありませんインポートすることができます。

他のすべてのモジュールでは、importsSharedModuleとなります。これで多くのクリーンアップが終わり、共有モジュールを1つだけ保守する必要があります。

関連項目:

+0

ありがとうございます。私は今それを見る。すべてのモジュールにモジュールをインポートする必要があります。インスタンスの再利用はありません。しかし問題はない。このSharedModuleは便利です!ありがとうございました! – Pstr

0

は私がWidgetsModuleFormsModule(@角度/フォーム)と同じであるので、それは実際には必要ないと思います。 WidgetsModuleはユーザー定義のモジュールで、FormsModuleは角度で提供されます。それが唯一の違いです。このモジュールは両方とも、いくつかの機能を実行するために使用されます。

だから私たちは一度FormsModuleを宣言し、その後、問題が解決されていることを理解した場合、他のすべてのモジュールでそれを使用することができますについてかと思います。

ちょうどそれが直接、それはそれ自身のFormsModule一つの方法または別の)への直接アクセスを必要とするだけのようWidgetsModule、独自にアクセスする必要があり、以下のリンクにOne single NgModule versus multiples ones with Angular 2

+0

私は..あなたがより少ない繰り返し輸入を持つために、一つに私のモジュールに参加する話をしている理解していませんか?しかし、これはモジュールのコードをあまりにも増やして、Angular2のモジュール化の考え方を打ち消します... – Pstr

+0

私は別のモジュール 'WidgetsModule'を作成して 'FormsModule'と同じ別のモジュールにインポートする必要がある 'モジュール化について'取っています –

+0

はい、私は別のWidgetsModuleを持っています。問題はそれを他のすべてのモジュールにインポートしなければならないこと、またはそれが親モジュールの同じインポートで共有できるかどうかということでした。しかし、今私はそれがこのようなことはできないことを理解しています。ありがとうございました! – Pstr

3

モジュールが他のモジュール内で宣言されているコンポーネント、ディレクティブまたはパイプへのアクセスを継承しません。 AppModuleがインポートするものはContactModuleとは無関係で、その逆もあります。 ContactComponentを[(ngModel)]とバインドする前に、ContactModuleはFormsModuleをインポートする必要があります。

source: ngmodule

関連する問題