다른 루트 구성 요소 파일 하나의 파일에서 구성 요소를 가져 오려고합니다. 그것은 ..로 오류를 제공합니다
zone.js : 484 처리되지 않은 약속의 거부 : 템플릿 구문 분석 오류 : '코스'는 알려진 요소가 아닙니다. 1. 'courses'가 Angular 구성 요소 인 경우이 모듈의 일부인지 확인하십시오. 2. 'courses'가 웹 구성 요소 인 경우이 구성 요소의 '@ NgModule.schema'에 "CUSTOM_ELEMENTS_SCHEMA"를 추가하여이 메시지를 표시하지 않습니다. ( "
내 첫 번째 각도 2 응용 프로그램
값 : 오류 : 서식 파일 구문 분석 오류 : (...) 오류 : 서식 파일 구문 분석 오류 : [오류 ->] ") : AppComponent @ 0 : '코스'는 알려진 요소가 아닙니다.
내 app.component.ts는 [루트 구성 요소 파일]과 유사해야합니다.
import { Component } from '@angular/core';
import {CoursesComponent} from './courses.component';
@Component({
selector: 'my-app',
template: '<h1>My First Angular 2 App</h1><courses></courses>',
directives:[CoursesComponent],
})
export class AppComponent { }
내 courses.component.ts가;
import { Component } from '@angular/core';
@Component({
selector: 'courses',
template: '<h1>courses</h1>'
})
export class CoursesComponent { }
app.component 내부의 courses.component.ts 파일에서 코스 구성 요소 가져 오기 중 지시문을 내부에서 선언 할 수 없습니다.@Component{}
directives:[CoursesComponent]나에게 오류를주고있다.
이 문제에 대한 해결책을 알려주십시오.
너는 그것으로 선언해야한다.declarations array(meta property) of @NgModule아래 그림과 같이 (RC5 and later),
import {CoursesComponent} from './courses.component';
@NgModule({
imports: [ BrowserModule],
declarations: [ AppComponent,CoursesComponent], //<----here
providers: [],
bootstrap: [ AppComponent ]
})
Angular RC5 및 RC6의 경우 모듈 메타 데이터 데코레이터에 구성 요소를 선언해야합니다.declarations키, 그래서 추가CoursesComponent당신의 메인 모듈에declarations같이아래에서 제거directives...에서AppComponent메타 데이터.
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import { CoursesComponent } from './courses.component';
@NgModule({
imports: [ BrowserModule ],
declarations: [ AppComponent, CoursesComponent ],
bootstrap: [ AppComponent ]
})
export class AppModule { }
각도 RC5 & amp; RC6
Jasmine 테스트에서 위에서 언급 한 오류가 발생하는 경우, Jasmine 테스트에서 렌더링 할 수없는 구성 요소를 선언해야하기 때문에 가능성이 큽니다.TestBed.configureTestingModule({}).
TestBed는 단위 테스트를위한 환경을 구성하고 초기화하며 유닛 테스트에서 구성 요소와 서비스를 조롱 / 생성 / 삽입하는 메소드를 제공합니다.
단위 테스트를 실행하기 전에 구성 요소를 선언하지 않으면 Angular는<courses></courses>템플릿 파일에 있습니다.
다음은 그 예입니다.
import {async, ComponentFixture, TestBed} from "@angular/core/testing";
import {AppComponent} from "../app.component";
import {CoursesComponent} from './courses.component';
describe('CoursesComponent', () => {
let component: CoursesComponent;
let fixture: ComponentFixture<CoursesComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [
AppComponent,
CoursesComponent
],
imports: [
BrowserModule
// If you have any other imports add them here
]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(CoursesComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
위의 답변 간단한 말로하면,
당신은 아래에 등록해야합니다.@NgModule'에스
declarations: [
AppComponent, YourNewComponentHere
]
의app.module.ts
잊지 마라.import그 구성 요소.