AngularJS Built-in directives ngClick
Example
The ng-click directive attaches a click event to a DOM element.
The ng-click directive allows you to specify custom behavior when an element of DOM is clicked.
It is useful when you want to attach click events on buttons and handle them at your controller.
This directive accepts an expression with the events object available as $event
HTML
<input ng-click="onClick($event)">Click me</input>
Controller
.controller("ctrl", function($scope) {
$scope.onClick = function(evt) {
console.debug("Hello click event: %o ",evt);
}
})
HTML
<button ng-click="count = count + 1" ng-init="count=0">
Increment
</button>
<span>
count: {{count}}
</span>
HTML
<button ng-click="count()" ng-init="count=0">
Increment
</button>
<span>
count: {{count}}
</span>
Controller
...
$scope.count = function(){
$scope.count = $scope.count + 1;
}
...
When the button is clicked, an invocation of the onClick function will print "Hello click event" followed by the event object.
