2014-10-16 5 views
1

Рассмотрим работоспособный пример:. http://plnkr.co/edit/1BfO7KkHeMD3EpsULNGP?p=preview

<html ng-app='app'> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.4/angular.js"></script> 
<script> 
angular.module('app', []) 
.directive('pwCheck', [function() { 
    return { 
     require: 'ngModel', 
     link: function (scope, elem, attrs, ctrl) { 
      var firstPassword = '#' + attrs.pwCheck; 
      elem.add(firstPassword).on('keyup', function() { 
        var v = elem.val()===$(firstPassword).val(); 
        console.log(v); 
        ctrl.$setValidity('pwcheck', v); 
      }); 
     } 
    } 
}]); 
</script> 
<form name="form"> 
<input type="text" id="pw1" name="pw1" ng-model="pw1Model"> 
<input type="text" name="pw2" pw-check="pw1" ng-model="pw2Model"> 
Valid: {{form.pw2.$valid}} 
<pre>{{form.pw2 |json}}</pre> 
</form> 

Написать характер я один из полей, и видеть, что действительность не обновляется до тех пор, второй символ не записывается в Действительность не правильно, если вы проверяете на копирование/вставку и т. д. Но регистрируется правильное значение v. Почему модель не изменилась правильно?

ответ

1

Wrap $setValidity в $ таймаут

$timeout(function() { 
    ctrl.$setValidity('pwcheck', v); 
}); 

http://plnkr.co/edit/OSuHBgtReDoCGWi03Cc8?p=preview

Я предполагаю, что есть какой-то конфликт с $setValidity зову угловой родной input директивы. Приобретение этого звонка в $timeout позволяет избежать этого конфликта.

+0

Он похож на nextTick()? – user1506145

+1

Да. Чтобы быть точнее, вызов $ setValidity будет поставлен в очередь. – Alexei

Смежные вопросы