bestsource

ng-model과 data-ng-model의 차이

bestsource 2023. 2. 23. 22:58
반응형

ng-model과 data-ng-model의 차이

AngularJs는 처음입니다.ng-model과 data-ng-model의 차이점을 말할 수 있는 사람?

ng-model의 경우

First Name  :  <input type="text" ng-model="fname" id="fname">
Second Name :  <input type="text" ng-model="lname" id="lname">  

data-ng-model의 경우

First Name  :  <input type="text" data-ng-model="fname" id="fname">
Second Name :  <input type="text" data-ng-model="lname" id="lname">  

양쪽에 걸쳐서ng-model그리고.data-ng-modelHTML5는 모든 커스텀아트리뷰트가 프리픽스 되는 것을 상정하고 있습니다.data-.

<!-- not HTML5 valid -->
<input type="text" ng-model="name">

<!-- HTML5 valid -->
<input type="text" data-ng-model="name">

둘 다 똑같아요.앵글 스트립은data-아트리뷰트에서 파트를 선택합니다.문서에서:

각도는 요소의 태그와 속성 이름을 정규화하여 어떤 요소가 어떤 방향과 일치하는지 판단합니다...정규화 프로세스는 다음과 같습니다.

  1. 벗다x-그리고.data-요소/속성 전면에서 확인할 수 있습니다.
  2. 변환하다:,-, 또는_- 허가된 이름camelCase.

와는 차이가 없다.ng-model그리고.data-ng-modelAngularJs로 보면요.

실제로 HTML5 검증을 검증하기 위한 접두사로 'data'가 사용됩니다.그래서 사용하는 것이 좋습니다.data-ng-model단,ng-model뿐만 아니라.그것도 문제없습니다.

둘 다 같은 의미와 동일한 출력을 가집니다.

ng-model의 경우

First Name  :  <input type="text" ng-model="fname" id="fname">
Second Name :  <input type="text" ng-model="lname" id="lname">  

data-ng-model의 경우

First Name  :  <input type="text" data-ng-model="fname" id="fname">
Second Name :  <input type="text" data-ng-model="lname" id="lname">  

베스트 프랙티스: 대시 구분 형식(ngBind의 경우 ng-bind 등)을 사용하는 것이 좋습니다.HTML 검증 도구를 사용하는 경우 대신 데이터 프리픽스 버전(예를 들어 ngBind의 경우 data-ng-bind)을 사용할 수 있습니다.위에 표시된 다른 양식은 레거시 이유로 허용되지만 사용하지 않는 것이 좋습니다.

sylewester의 답변은 정확하며 Angular에서 읽을 수 있습니다.JS Directive 매뉴얼은 https://docs.angularjs.org/guide/directive에 있습니다.

Angular에서

(이것이 sylwester의 답변을 이해하는 데 도움이 되었기 때문에 다른 사람들도 도움이 될 수 있다고 생각했습니다.)

sylewester의 답변은 정확하며 Angular에서 읽을 수 있습니다.JS Directive Documentation은 https://docs.angularjs.org/guide/directive에 있습니다.다음은 그 페이지에서 발췌한 것입니다.

AngularJS는 요소의 태그와 속성 이름을 정규화하여 어떤 요소가 지시와 일치하는지 확인합니다.일반적으로 명령어는 대소문자를 구분하는 camelCase 정규화된 이름(ngModel 등)으로 나타냅니다.그러나 HTML은 대소문자를 구분하지 않기 때문에 일반적으로 DOM 요소(예: ng-model)에서 대시 구분 속성을 사용하여 DOM의 지시어를 소문자로 나타냅니다.

정규화 프로세스는 다음과 같습니다.

요소/속성 전면에서 x와 데이터를 제거합니다.:, - 또는 _ 구분 이름을 camelCase로 변환합니다.

예를 들어 다음 형식은 모두 동일하며 ngBind 디렉티브와 일치합니다.

프리픽스

Angular에서

(이것이 sylwester의 답변을 이해하는 데 도움이 되었기 때문에 다른 사람들도 도움이 될 수 있다고 생각했습니다.)

언급URL : https://stackoverflow.com/questions/24508053/difference-between-ng-model-and-data-ng-model

반응형