2017-12-14 5 views
1

나는 Angular 5 forms youtube tutorial을 검토 중이며 Sebastian은 처음에 양식 선택기가 app-form01인데 그는 app- 부분을 제거합니다. IIUC 사용자 정의 요소는 -으로되어 있습니다. 여유롭게 지냈습니까?각도 5 구성 요소에는 선택기에`-`가 있어야합니까?

+0

아니요, 규칙이 완화되지 않았습니다. 그러나 Angular는 아마도 규칙에 어긋나지 않을 것입니다. 그들의 구성 요소 스타일에 문제가되지 않을 수도 있습니다. https://w3c.github.io/webcomponents/spec/custom/#valid-custom-element-name – Intervalia

답변

2

당신은 그것을 위해 또 다른 식별자입니다, 각도는 단어가 결합되어 알 수 없습니다의 - 분리 단어없이 태그를 가질 수 있습니다

<app-my-tag> - 또한><appmytag>

, 당신은 할 수 있습니다 모두 전체 접두사를 생략 :

<app-my-tag> -><mytag>

그러나 구분 기호를 -으로 사용하지 않으면 태그를 읽기가 어려워지고 사용자 정의 태그에 접두사를 사용하지 않으면 이름 충돌의 가능성이 높아집니다.

+0

웹 구성 요소 이름 지정 규칙을 준수하므로 '-'대시를 사용하는 것이 익숙 할 수도 있습니다. 그리고 Angular에서 Native 구성 요소로 이동 한 경우 대시를 사용해야합니다. – Intervalia

5

-은 전혀 필요하지 않습니다. 사용자 지정 요소 요구 사항을 준수하기 때문에 좋은 방법으로 간주됩니다. 그 외에도 구성 요소의 동작은 -이 있든 없든 정확히 동일하며 대소 문자가 혼용 된 이름을 사용할 수도 있습니다.

우리가 요소 선택기 때문에 custom element spec의 를 dasherized 보관 kebab-case removal 동안도

참조하십시오.

구성 요소 이름은 대시가 우리가 템플릿 (유효 HTML5를 조각이 남아도 각도 템플릿 대소 문자를 구분 한 후 이후 지침에 사용하는 사용자 정의 요소 사양에 의해 필요하기 때문에 대시 맡았다 남아 때문에 높은 충실도 있지만, 대문자와 소문자를 구분하여 Google 파서 만 볼 수 있음).

사람은 거의 사용자 정의 요소 사양 및 대시이 우리에게주는 보증에 대해 알고, 그래서 나는 모든 지침/구성 요소 선택기는 적어도 하나의 대시 을 가지고 시행하는 것이 더 될 것이라고 생각합니다. 구성 요소/지시어 메타 데이터의 플래그를 통해 옵트 아웃하는 방법이 있어야하지만 기본적으로 설정되어 있으면 안됩니다. 누군가가 사용자 정의 요소 사양에 익숙하지 않은 경우

, 요소 이름에 대시를 추가 의 장점은 다음과 같습니다

  • 요소가 사용자 정의 요소가된다 -는 DOM 노드의 유형은 는 HTMLElement 대신하다 경우에 HTMLUnknownElement
  • 의 우리는 document.registerElement를 통해
  • 사양 보증을 가짜 요소 를 등록하여 :unresolved psedo-class에서, 우리가 할 수있는 혜택 필요 브라우저가 012을 것이다은 이름에 대시가 포함 된 기본 요소를 소개하지 않습니다. 즉, 브라우저에서 각도 구성 요소 선택 도구와 일치하는 요소를 기본적으로 구현해야 나중에 앱을 중단 할 수 있습니다 (예 : ).)

자세한 내용 custom elements.

관련 문제