AngularJS: Watch form for input change on blur

Question

I recently searched for that many times and haven't found any good answer or the right solution for me. I wanna create a directive to control my form input change on blur. It is for editing user settings inside a tool.

So the user is clicking inside a input field from a form called 'generall', until here nothin should happen, if the user is editing (typing) also nothin should happen. Now the user clicks outside (blur) the field, the directive should call a function like 'updateSettings' and give them the form name (generall) and all name + value from the fields.

Could look like that var vars = { formName: 'generall', fields: {ALLFIELDS} } .

I tried that allready with that function:

return {
  require: "form",
  link: function(scope, element, attrs){z
    var cb = $parse(attrs.formOnChange);
    element.on("change", function(){
      cb(scope);
    });
  }
}; 

Here is my code: https://plnkr.co/edit/KrjtJVCS9kxRckMH3Mv6?p=preview

Answer 1

use

element.on("blur",function(){})

sample directive

app.directive("myDirective", function ($rootScope) {

    return {
        controller: function ($scope) {

        }, //end of controller
        restrict: 'A',
        // element must have ng-model attribute.
        require: 'ngModel',
        link: function ($scope, ele, attrs, ngModel, $rootScope) {

            ele.on('blur', function () {
               //write functionality here 

            });

        }, //end of link function
    } //end of return
}); //end of myDirective