Blur directive in AngularJS
There is no native support for blur
event in AngularJS
. With this directive you can handle blur event in your AngularJS
controllers:
Module.directive('ng-blur', function() {
return {
restrict: 'A',
link: function postLink(scope, element, attrs) {
element.bind('blur', function () {
scope.$apply(attrs.ngBlur);
});
}
};
});
And use it in html
template:
<input type="text" ng-blur="handleInputBlur()"></input>
And handle it in controller:
$scope.handleInputBlur = function(){
// do some action here
}
Written by 0xAX
Related protips
5 Responses
The directive's name should be ngBlur instead of ng-blur in angular 1.1.3
over 1 year ago
·

don't use "ng" as a prefix.. let the angular.js guys to do it, and use your own prefix :)
over 1 year ago
·

Thank you! This worked perfectly.
over 1 year ago
·

Thank you, this has been very helpful.
over 1 year ago
·

@allain, @martinhaluza glad to help :)
over 1 year ago
·
Have a fresh tip? Share with Coderwall community!
Post
Post a tip
Best
#Angularjs
Authors
Sponsored by #native_company# — Learn More
#native_title#
#native_desc#