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-model
HTML5는 모든 커스텀아트리뷰트가 프리픽스 되는 것을 상정하고 있습니다.data-
.
<!-- not HTML5 valid -->
<input type="text" ng-model="name">
<!-- HTML5 valid -->
<input type="text" data-ng-model="name">
둘 다 똑같아요.앵글 스트립은data-
아트리뷰트에서 파트를 선택합니다.문서에서:
각도는 요소의 태그와 속성 이름을 정규화하여 어떤 요소가 어떤 방향과 일치하는지 판단합니다...정규화 프로세스는 다음과 같습니다.
- 벗다
x-
그리고.data-
요소/속성 전면에서 확인할 수 있습니다.- 변환하다
:
,-
, 또는_
- 허가된 이름camelCase
.
와는 차이가 없다.ng-model
그리고.data-ng-model
AngularJs로 보면요.
실제로 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에 있습니다.
(이것이 sylwester의 답변을 이해하는 데 도움이 되었기 때문에 다른 사람들도 도움이 될 수 있다고 생각했습니다.)
sylewester의 답변은 정확하며 Angular에서 읽을 수 있습니다.JS Directive Documentation은 https://docs.angularjs.org/guide/directive에 있습니다.다음은 그 페이지에서 발췌한 것입니다.
AngularJS는 요소의 태그와 속성 이름을 정규화하여 어떤 요소가 지시와 일치하는지 확인합니다.일반적으로 명령어는 대소문자를 구분하는 camelCase 정규화된 이름(ngModel 등)으로 나타냅니다.그러나 HTML은 대소문자를 구분하지 않기 때문에 일반적으로 DOM 요소(예: ng-model)에서 대시 구분 속성을 사용하여 DOM의 지시어를 소문자로 나타냅니다.
정규화 프로세스는 다음과 같습니다.
요소/속성 전면에서 x와 데이터를 제거합니다.:, - 또는 _ 구분 이름을 camelCase로 변환합니다.
예를 들어 다음 형식은 모두 동일하며 ngBind 디렉티브와 일치합니다.
(이것이 sylwester의 답변을 이해하는 데 도움이 되었기 때문에 다른 사람들도 도움이 될 수 있다고 생각했습니다.)
언급URL : https://stackoverflow.com/questions/24508053/difference-between-ng-model-and-data-ng-model
'bestsource' 카테고리의 다른 글
리차트를 사용하여 응답형 차트의 높이와 폭을 설정합니다(Barchart). (0) | 2023.02.23 |
---|---|
html5Mode를 사용하는 Angularjs 일반 링크 (0) | 2023.02.23 |
마운트/언마운트 사이에 React 컴포넌트 상태를 유지하는 방법 (0) | 2023.02.23 |
사용자 지정 위젯에서 woocommerce 미니 카트의 사용자 지정 템플릿을 로드하는 방법 (0) | 2023.02.23 |
패키지를 자동으로 빌드할 수 있는 방법이 있나요?Node.js 프로젝트용 json 파일 (0) | 2023.02.23 |