오류 : 'AppModule'에 대한 NgModule 메타 데이터가 없습니다.

Question

건물에있는 각도 2 앱에 문제가 있습니다. 다양한 위치에서 복사/붙여 넣기 기술을 연습 해 왔으며 모든 빌드 오류를 제거했지만 브라우저에서 실행하면 브라우저에 오류가 발생합니다. this post을 보았지만 문제가 해결되지 않았습니다.

내 AppModule은 다음과 같습니다

import { NgModule, ApplicationRef } from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { FormsModule } from '@angular/forms'; 
import { HttpModule } from '@angular/http'; 
import { RouterModule } from '@angular/router'; 
import { ROUTES } from './app.routes'; 
import { HomeComponent } from '../index'; 

@NgModule({ 
    bootstrap: [ AppModule ], 
    declarations: [ 
    AppModule, 
    HomeComponent 
    ], 
    imports: [ 
    BrowserModule, 
    FormsModule, 
    HttpModule, 
    RouterModule.forRoot(ROUTES, { useHash: true }) 
    ] 
}) 
export class AppModule { 
} 

이 같은 부트 스트랩 해요 :

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 
import { AppModule } from './index'; 

platformBrowserDynamic().bootstrapModule(AppModule); 

을하지만 내 브라우저에서, 나는이 오류를 얻을 :

ng_module_resolver.js:34 Uncaught Error: No NgModule metadata found for 'AppModule'.

이 어떻게을 나는 이것을 해결합니까?

업데이트 내 코드는 지금처럼 보이지만 여전히 오류가 발생

:

import { NgModule } from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { FormsModule } from '@angular/forms'; 
import { HttpModule } from '@angular/http'; 
import { RouterModule } from '@angular/router'; 
import { ROUTES } from './app.routes'; 
import { HomeComponent } from '../index'; 
import { AppComponent } from './app.component'; 

@NgModule({ 
    bootstrap: [ AppComponent ], 
    imports: [ 
     BrowserModule, 
     FormsModule, 
     HttpModule, 
     RouterModule.forRoot(ROUTES, { useHash: true }) 
    ], 
    declarations: [ 
     HomeComponent, 
     AppComponent 
    ] 
}) 
export class AppModule { 
} 

그리고 bootstraping :

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 
import { AppComponent } from './index'; 

platformBrowserDynamic().bootstrapModule(AppComponent); 

이 지금지고있어 오류는 다음과 같습니다

를

Uncaught Error: No NgModule metadata found for 'AppComponent'

AppComponent 또는 부트 스트래핑 또는 모듈 선언과 메타 데이터에서 오류가 있습니까? 문서가 모호합니다.

Answer 1

적어도 코드에는 세 가지 실수가 있습니다. 먼저

- 당신이 구성 요소를 bootstraping있다, 이것은 잘못된 것입니다 - 당신은 당신의 경우 AppModule에 모듈을 부트 스트랩해야하며 AppModule에 당신은 부트 스트랩 될 것입니다 구성 요소를 선택해야합니다. 둘째

- 당신은 부트 스트랩 될 것 구성 요소로 AppModule를 지정하는 예를 HomeComponent를 들어,

bootstrap: [ AppModule ] 

당신은되지 부트 스트랩 모듈, 당신은 구성 요소를 부트 스트랩 할 수 있습니다. 내가 볼 수 있듯이, 그것이 당신이 가진 유일한 구성 요소입니다. -

셋째 당신은 그 선언에 AppModule를 추가 :

declarations: [ 
    AppModule, 
    HomeComponent 
] 

당신이 모듈을 선언 할 수있는 경우에도 당신은 간단하게이 작업을 수행 할 수 없습니다, 당신은 단지 모듈의 선언에 구성 요소, 지침 및 파이프를 추가해야하는 이유 AppModule 자체를 신고 하시겠습니까?

@NgModule({ 
    imports: [ 
    BrowserModule, 
    FormsModule, 
    HttpModule, 
    RouterModule.forRoot(ROUTES, { useHash: true }) 
    ], 
    declarations: [ HomeComponent ], 
    bootstrap: [ HomeComponent ] 
}) 

export class AppModule { 
} 

을 그리고 AppModule 부트 스트랩 :이 코드를 시도

platformBrowserDynamic().bootstrapModule(AppModule);