programing

angularjs의 ng-click과 data-ng-click의 차이점은 무엇입니까?

css3 2023. 3. 1. 11:24

angularjs의 ng-click과 data-ng-click의 차이점은 무엇입니까?

처음에 봤을 때data-ng-click버튼을 누를 때 메서드에 대한 인수를 호출해야 하므로 일부 데이터를 전달할 수 있습니다.

하지만 차이를 모르겠어요.

코드 일부를 추적했습니다.

HTML

<input 
    type="button" 
    value="Fess"
    ng-click="toggle(2)">

또는

<input 
    type="button" 
    value="Fess"
    data-ng-click="toggle(2)">

JS

$scope.toggle = function (valueS) {
    alert(valueS);        
}

둘 다 일해요.

감사해요.

그것들은 같은 것이다.사용할 수 있습니다.data-ng-click유효한 html을 만듭니다.

지시문의 각진 문서에서 다음 작업을 수행합니다.

디렉티브에는 ngBind와 같이 camel로 구분된 이름이 있습니다.디렉티브는 카멜 대소문자명을 특수문자, - 또는 _를 사용하여 snake 대소문자로 변환함으로써 호출할 수 있습니다.선택적으로 지시문 앞에 x- 또는 data-를 붙여 HTML 검증자를 준수할 수 있습니다.ng:bind, ng-bind, ng_bind, x-ng-bind 및 data-ng-bind 중 몇 가지 가능한 디렉티브 이름을 다음에 나타냅니다.

그들을 배제하는 것은 실질적인 목적으로는 전혀 문제가 되지 않는다.다만 html validator 서비스를 통해 실행하면 호환성이 있는 것으로 전달되지 않습니다.

HTML5는 모든 HTML 요소에 커스텀 데이터 속성을 내장할 수 있습니다.

이러한 새로운 커스텀 데이터 속성은 다음 두 부분으로 구성됩니다.

Attribute Name 데이터 Attribute name은 최소 한 글자 길이여야 하며 'data-' 앞에 접두사를 붙여야 합니다.대문자는 사용할 수 없습니다.

Attribute Value Attribute 값은 임의의 문자열이 될 수 있습니다.

<li data-spacing="30cm" data-sowing-time="February to March">Celery</li>

출처 : http://html5doctor.com/html5-custom-data-attributes/

양식을 사용하거나 사용하지 않고 사용하는 동안 차이를 발견했습니다.

나의 요소가 형태일 때 그들은 똑같이 행동한다.

사용할 때data-ng-click폼 내에 없는 요소에서는 클릭 이벤트가 발생하지 않습니다.

언급URL : https://stackoverflow.com/questions/16505866/what-is-the-difference-between-ng-click-and-data-ng-click-in-angularjs