What is the difference between ng-click and data-ng-click in angularjs?

Question

From 1st view seems like data-ng-click can pass some data as argument to method should be invoked during pressing on button.

But I don\'t see the differ

Answer 1

HTML5 has an ability to embed custom data attributes on all HTML elements

These new custom data attributes consist of two parts:

Attribute Name The data attribute name must be at least one character long and must be prefixed with 'data-'. It should not contain any uppercase letters.

Attribute Value The attribute value can be any string.

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

source : http://html5doctor.com/html5-custom-data-attributes/

Answer 2

They are the same thing. You can use data-ng-click to make a valid html.

Answer 3

From the angular docs on directives:

Directives have camel cased names such as ngBind. The directive can be invoked by translating the camel case name into snake case with these special characters :, -, or _. Optionally the directive can be prefixed with x-, or data- to make it HTML validator compliant. Here is a list of some of the possible directive names: ng:bind, ng-bind, ng_bind, x-ng-bind and data-ng-bind.

Leaving them out is totally fine for practical purposes. It's just that if you run it through an html validator service, it will not pass as complliant.

Answer 4

Found a difference while using with and without Form.

When my element is in a Form they act the same.

When I use data-ng-click on an element not within a form, Click event is not happening.