угловая проверка on-blur в директиве

Question

Я новичок в угловых js и хочу проверить поле размытия. Поскольку я вхожу в значение, вызываемое директивой и проверяющее введенное значение. Я хочу, чтобы это произошло на -blur. У меня уже есть пользователь в blur в html для вызова некоторой другой функции.

Ниже директива:

app.directive("emailCheck", function(){ 
return { 
    require: 'ngModel', 
    link: function (scope, elm, attrs, ctrl) { 
     ctrl.$parsers.unshift(function (viewValue, $scope) { 
      var emailPattern = /\S+@\S+\.\S+/; 
      var isEmailValid = emailPattern .test(viewValue) 
      ctrl.$setValidity('emailFormat', isEmailValid); 
      return viewValue; 
     }) 
    } 
}; 
}); 

Как я проверить на размытия события здесь?

Заранее спасибо.

Answer 1

вы должны связать blur событие для директивы. попробуйте так:

link: function (scope, elm, attrs, ctrl) { 
    elm.bind('blur',function(){ 
    }) 
} 

var app = angular 
 
    .module('MyApp', [ 
 
    ]) 
 
.controller('Main', ['$scope', function ($scope) { 
 

 
}]) 
 
.directive("emailCheck", function(){ 
 
return { 
 
    require: 'ngModel', 
 
    link: function (scope, elm, attrs, ctrl) { 
 
     elm.bind('blur',function(){ 
 
     alert("test"); 
 
     }) 
 
    } 
 
}; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div class="main-content" ng-app="MyApp" ng-controller="Main as myCtrl"> 
 
     <div> 
 
      <input type="text" ng-model="email" email-check> 
 
    </div> 
 
</div>

Answer 2

Вы должны обрабатывать событие размытости внутри директивы и удалить то же самое от элемента HTML обрабатывать его в следующей манере:

app.directive("emailCheck", function(){ 
return { 
    require: 'ngModel', 
    link: function (scope, elm, attrs, ctrl) { 
     elm.on('blur', function() { 
      // @TODO you will have to put your code here to handle this event 
     }); 
    } 
}; 
}); 

Answer 3

Обычно, когда вы используете ngModel в своей директиве, вы не решаете, какое событие зацепить. Вы подписываетесь на любое событие, к которому подключен ngModel. По умолчанию это не просто размытие.

Пользователь вашей директивы можно использовать ngModelOptions с updateOn: blur`` для обновления только на размытость, как:

<input 
    email-check 
    name="testEmail" ng-model="testEmail" 
    ng-model-options="{ updateOn: 'blur' }"> 

<!-- Note using "updateOn: 'blur'" NOT "updateOn: 'default blur'" --> 

ngModelOptions Docs

Answer 4

Попробуйте это.

define(['app'],function(app){ 
app.directive('myDecimals', function() { 
    return { 
    restrict: 'A', 
    link: function(scope, elm, attrs) { 

     elm.bind('blur',function(){ 
      elm.val(elm.val()*1); 
     }); 
    } 
    }; 
}); 
});