2017-02-19 6 views
6

방금 ​​ng2 cli를 사용하여 bearbones ng2 앱을 설치했습니다. 내 AppModuleschema: [ CUSTOM_ELEMENTS_SCHEMA ]을 추가했으며 AppComponent 템플릿에는 <row></row>이 있습니다. 하지만 getting- 해요Angular2 CUSTOM_ELEMENTS_SCHEMA가 작동하지 않습니다.

처리되지 않은 약속 거부 : 템플릿 구문 분석 오류 : '행'하지 알려진 요소는 다음과 같습니다 '행'은 코너 구성 요소 인 경우 은 1, 다음이의 일부임을 확인 기준 치수. 2. 'row'가 웹 구성 요소 인 경우이 구성 요소의 '@ NgModule.schemas'에 "CUSTOM_ELEMENTS_SCHEMA"를 추가하여이 메시지를 표시하지 않습니다. ("[ERROR ->]

AppModule-

import { BrowserModule } from '@angular/platform-browser'; 
import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; 
import { FormsModule } from '@angular/forms'; 
import { HttpModule } from '@angular/http'; 

import { AppComponent } from './app.component'; 


@NgModule({ 
    declarations: [ 
    AppComponent 
    ], 
    imports: [ 
    BrowserModule, 
    FormsModule, 
    HttpModule 
    ], 
    providers: [], 
    bootstrap: [AppComponent], 
    schemas: [ CUSTOM_ELEMENTS_SCHEMA ] 
}) 
export class AppModule { } 

AppComponent-

import { Component } from '@angular/core'; 

@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'] 
}) 
export class AppComponent {} 

AppComponentTemplate- 그것은 도대체 무엇을 가고있어 정말 간단한

<row></row> 

. 에?

편집 :

아래의 모든 대답은 만족스럽고 문제에 대한 통찰력을 제공합니다. @yurzui 나는 특히 소스를 제공하는 당신의 대답을 좋아합니다. 나는 너에게 받아 들여진 대답을 모두 줄 수 있었으면 좋겠다! 하지만 첫 번째로 내 문제에 대한 직접적인 해결책을 제시하기 위해 @camaron을 선택합니다. Google을 통해이 질문을 찾으면 @yurzui, @camaron 및 @Aravind에게이 문제와 관련하여 +1 해주세요.

답변

9

당신은 당신의 AppModule

imports: [RowComponent]

편집에 의해 수입되는 RowComponent을 추가해야합니다 : 각도가 존재하지 않는 구성 요소를 찾기 위해 노력하고 있기 때문에

사용 NO_ERRORS_SCHEMA이입니다.

CUSTOM_ELEMENTS_SCHEMA은 선택자 이름에 -이있는 구성 요소입니다.

+0

'RowComponent'가 없습니다. 문제가 있습니다. 구성 요소가 아니며 단지 임의의 요소 이름입니다. –

+0

마지막 자원으로 NO_ERRORS_SCHEMA 시도하십시오 –

+0

그래, 그 작품. CUSTOM_ELEMENTS_SCHEMA가 작동하지 않는 이유를 알고 싶습니다. 아무도 그 질문에 대답 할 수 없다면 나는 이것을 대답으로 선택할 것입니다. –

5

알 수없는 속성을 구문 분석하는 동안 변경 로그 기본, 각도 의지 오류로 https://github.com/angular/angular/blob/master/CHANGELOG.md#200-rc5-2016-08-09

를 보는 경우에, 도 그들이 가진 요소에있는 경우 - 이름에(일명 사용자 정의 요소). 응용 프로그램에서 사용자 정의 요소를 사용하는 경우 값이 [CUSTOM_ELEMENTS_SCHEMA] 인 새로운 매개 변수 @ NgModule.schemas를 채 웁니다.

는 당신이

if (tagName.indexOf('-') > -1) { 
     if (tagName === 'ng-container' || tagName === 'ng-content') { 
     return false; 
     } 

     if (schemaMetas.some((schema) => schema.name === CUSTOM_ELEMENTS_SCHEMA.name)) { 
     // Can't tell now as we don't know which properties a custom element will get 
     // once it is instantiated 
     return true; 
     } 
} 

https://github.com/angular/angular/blob/2.4.8/modules/%40angular/compiler/src/schema/dom_element_schema_registry.ts#L290

그래서 my-row 같은 것이 다음

+0

나는 근원에 진짜로 연결을 평가한다! +1 –

3

가 실수 있습니다 작동합니다 - 구분에 태그를해야한다는 것을 이해할 수

  1. AppComponent 만 가져 왔지만 <row>을 템플릿으로 사용하는 요소가 없습니다.
  2. CUSTOM_ELEMENTS_SCHEMA은 (오류 설명에서 말한 것처럼) 템플릿을 구문 분석 할 때 발생하는 오류를 숨기기 위해 사용되므로 응용 프로그램 개발 중에 사용할 필요가 없습니다.
  3. <app-root>은 AppComponent의 선택 자이지만 AppComponent의 html에는 <row>을 사용했습니다.

귀하의 요구 사항에 따라 다양한 수정 사항을 제안 할 수 있습니다. 원하는 결과로 의견을 말하면 그에 따라 답변을 업데이트 할 것입니다.