2017-10-31 6 views
0

응용 프로그램 모듈에

app.module.ts 

    `import { NgModule } from '@angular/core'; 
    import { BrowserModule } from '@angular/platform-browser'; 
    import { FormsModule, ReactiveFormsModule, FormGroup } from'@angular/forms'; 
    import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; 
    import { AppComponent } from './app.component'; 

    /*Routing Module*/ 
    import {AppRoutingModule} from './app-routing.module'; 

    /*Core Module*/ 
    import { CoreModule } from './core/core.module'; 

    /*Shared Module*/ 
    import {SharedModule} from './shared/shared.module'; 

    /*Featured Module*/ 
    import { LoginModule } from './login/login.module'; 
    import { LandingModule } from './landing/landing.module'; 

    @NgModule({ 
    imports: [ 
     BrowserModule, 
     FormGroup, 
     FormsModule, 
     ReactiveFormsModule, 
     SharedModule.forRoot(), 
     LandingModule, 
     LoginModule, 
     CoreModule.forRoot(), 
     AppRoutingModule, 
     BrowserAnimationsModule 
    ], 
    declarations: [ 
    AppComponent, 
    ], 
    providers: [], 
    bootstrap: [AppComponent] 
}) 
export class AppModule { } 

공유 모듈

다음
shared.module.ts 

`import { NgModule, ModuleWithProviders } from '@angular/core'; 
import { CommonModule } from '@angular/common'; 
import { FlexLayoutModule } from '@angular/flex-layout'; 
import { MaterialModule } from './material.module'; 

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

export class SharedModule { 
     static forRoot(): ModuleWithProviders { 
    return { 
     ngModule: SharedModule, 
     providers: [] 
    }; 
    } 
} 

기능 모듈

landing.module.ts 

    `import { NgModule } from '@angular/core'; 
    import { CommonModule } from '@angular/common'; 
    import { FormsModule, FormGroup, FormBuilder, Validators } from '@angular/forms'; 
    import {SharedModule} from '../shared/shared.module'; 

    import { LandingRoutingModule } from './landing-routing.module'; 
    import { HomeComponent } from './home/home.component'; 
    import { RegisterComponent } from './register/register.component'; 


    @NgModule({ 
     imports: [ 
     CommonModule, 
     FormsModule, 
     FormGroup, 
     SharedModule, 
     LandingRoutingModule 
     ], 
     declarations: [HomeComponent, RegisterComponent] 
    }) 
    export class LandingModule { } 

을 오류가 발생합니다 RegisterComponent FormGroup을 사용해 보았는데 콘솔에 오류가 발생했습니다. compiler.es5.js : 1694 Uncaught Error : 모듈 'AppModule'에 의해 가져온 'FormGroup'의 예기치 않은 값. @NgModule 주석을 추가하십시오. 사람이내 기능 모듈에 FormGroup 수입하고 있고 내 안에 Angular4 여러 모듈 구조

코어 모듈을 여러 모듈

`import {ModuleWithProviders, NgModule, Optional, SkipSelf } from '@angular/core'; 
import { CommonModule } from '@angular/common'; 

import { HttpService } from './http.service'; 
import { StoreService } from './store.service'; 

@NgModule({ 
    imports:  [ CommonModule ], 
    declarations: [], 
    exports:  [] 
    }) 
    export class CoreModule { 
    constructor (@Optional() @SkipSelf() parentModule: CoreModule) { 
     if (parentModule) { 
      throw new Error(
      'CoreModule is already loaded. Import it in the AppModule only'); 
     } 
     } 

     static forRoot(): ModuleWithProviders { 
     return { 
      ngModule: CoreModule, 
      providers: [ HttpService, StoreService ] 
     }; 
    } 
    }` 

앱 routing.module 또한

`import {NgModule} from '@angular/core'; 
import {RouterModule, Routes} from '@angular/router'; 

const appRoutes: Routes = [ 
    { path:'', redirectTo:'home', pathMatch:'full' }, 
    { path: 'login', loadChildren: 'app/login/login.module#LoginModule' } 
]; 

@NgModule({ 
    imports: [ 
    RouterModule.forRoot(appRoutes) 
    ], 
    exports: [ 
    RouterModule 
    ] 
}) 

export class AppRoutingModule { 
}` 

그리고 게으른 로딩을 할 수있는 올바른 방법을 모듈을 가져올 나에게 올바른 방법을 말할 수 있었다하시기 바랍니다. 감사합니다

+0

, 내 기능 모듈에 ReactiveformsModule을 가져 놓쳤다 구성 요소에서 가져올 수 있습니다 사람은 코어 또는에서 formsModule, ReactiveformsModule을 배치 할 곳으로 도움을 줄 수 다시 공유하기 때문에 피쳐 모듈에서 가져올 필요가 없으며 내 피쳐 모듈을 지연로드하는 올바른 방법도 있습니다. – Enthu

답변

0

아무 모듈 안에도 FormGroup을 사용할 필요가 없습니다. Feature Module에서 제거하십시오.

직접, iteself이 오류가 formgroup 고정되어

NgModule({ 
     imports: [ 
     CommonModule, 
     FormsModule,  
     SharedModule, 
     LandingRoutingModule 
     ], 
declarations: [HomeComponent, RegisterComponent] 
+0

선언에 추가 한 후 Uncaught Error가 발생합니다 : 'AppModule'모듈에서 'FormGroup'이 예기치 않은 값으로 선언됩니다. @ Pipe/@ Directive/@ Component 주석을 추가하십시오. – Enthu

+0

착륙 모듈에서 수정 한 후 잡히지 않은 오류가 발생합니다. 템플릿 구문 분석 오류 : 'form'의 알려진 속성이 아니기 때문에 'formGroup'에 바인딩 할 수 없습니다. 올바르게 가져올 위치를 알려 주시겠습니까? 덕분에 여러 모듈을 사용하고 있습니다. – Enthu

+0

죄송합니다. 동일한 템플릿 구문 분석 오류가 발생합니다. – Enthu