2017-02-12 16 views
7

here açıklandığı gibi bir Angular2 uygulaması yaptım. Global app.module tarafından ithal edilen iki bileşene (A, B) sahiptir. Benim düşüncem, app.module içinde paylaşılan modülleri dahil etmek, bu yüzden her bir modülü gereksiz kodla karıştırmam gerekmiyordu. Örneğin FormsModule ile yapmak istiyorum. Yani app.module IAngular2'deki ana modülden alt modüle yapılan ithalatı devralma

imports: [ 
    UniversalModule, 
    CommonModule, 
    FormsModule, 
    AModule 
    RouterModule.forRoot([]) 
], 

exports: [FormsModule] 

var Ama bir modülünde eksik FormsModule kaynaklanan görünüyor istisna Can't bind to 'ngModel' since it isn't a known property of 'select'. aldık. Yalnızca, imports: [FormsModule]'u kullanarak her alt modülde FormsModule'u aldığımda çalışır. Tam olarak kaçınmak istediğim şey bu.

this question göre ben bu işe ve bana Exception: Call to Node module failed with error: Error: Unexpected value 'undefined' imported by the module 'AModule'

nasıl çocuk modüllerine ithalatı devralabilir istisna vermez çocuk modülü A'da AppModule içe çalıştık? Bunu borulara da ihtiyacım var.

cevap

6

Sadece birlikte kullanılan bileşenleri, yönergeleri ve boruları dışa aktaran ve bu modülü bunlardan herhangi birini kullanmak istediğiniz modüle aktaran bir özellik modülü (veya paylaşılan modül) oluşturun.

Global olarak bileşen, yönerge veya boru üretmenin bir yolu yoktur. Kullanıldıkları her modülün ithalatına eklenmeleri gerekiyor. Tek yapmanız gereken modülleri birleştirmek ve sadece bir veya birkaç modül almak suretiyle bunları kullanılabilir hale getirmektir.

4

Bunun, sadece Günter Zöchbauer gibi, paylaşılan ithalatı toplayan paylaşılan bir modül kullanılarak yapılabildiğini söyledi. Bunu yaptığıma benim paylaşılan modül oluşturmak için bir üs olarak kullanılan, hangi an example in the official docs bulundu:

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

import { ObjectKeysPipe } from './../shared/pipes/object-keys.pipe'; 

@NgModule({ 
    imports: [CommonModule], 
    declarations: [ 
     ObjectKeysPipe 
    ], 
    exports: [ 
     CommonModule, 
     FormsModule, 
     ObjectKeysPipe 
    ] 
}) 
export class GlobalSharedModule{} 

Bu benim (ObjectKeysPipe) ve her ikisi de yaygın CommonModule ve FormModule kullanılan bir özel borusunu paylaşır. Redudant karışıklık azaltma fikri işe yaradı. Uygulama modüllerimde, bir grup ithalat/beyan eklemem gerekmiyor. Bunun yerine, sadece böyle Paylaşılan modülü almak gerekir:

import { GlobalSharedModule } from './../shared/global-shared.module'; 
@ngModule({ 
    imports: GlobalSharedModule 
}) 
+0

Bir gol ithalat './../../../../../' zincirleri üzerine zincirlerini KULLANMAYIN etmektir modüller. Bunu yapmanın herhangi bir yolu var mı? –

+0

@DouglasGaskell 'compilerOptions' altındaki' tsconfig.json'unuzda ve sonra 'paths'' 'store '' gibi bir yol bildirebilirsiniz: [" src/store.ts "]'. Bkz. [Link] (https://www.typescriptlang.org/docs/handbook/module-resolution.html#path-mapping) –