2016-08-02 1 views
0

を通関ディレクティブと通常のNG-指令を実行する私は二回、電子メールを確認するための入力を持っている、はどのようにも

しかし、もはや機能していません。

提案がありますか?私は、ユーザーが

HTML

<input type="text" 
     id="confirm_email_booking" 
     name="confirm_email_booking" 
     class="form-control" 
     check-email 
     ng-model="payment_contact.confirm_email_booking" 
    /> 

JS、このフィールドを空白保持したくない

app.directive('checkEmail', function() { 
    return { 
     require: 'ngModel', 
     link: function(scope, elm, attrs, ctrl) { 
      ctrl.$parsers.unshift(function(viewValue, $scope) { 
       var notMatch = (viewValue != scope.form.email_booking.$viewValue) 
       ctrl.$setValidity('notMatch', !notMatch) 

       return notMatch; 
      }) 
     } 
    } 
}) 
+0

まあ、私は – developer033

+0

は、なぜあなたは、単にCTRL 'に検証関数を追加しない...ここに' required'を見ることができません。$のvalidators'を? – MMhunter

答えて

0

値は以下のように、あなたの指示で存在ある場合は、単にチェックすることができます。

var notMatch = viewValue && viewValue != scope.form.email_booking.$viewValue; 

次に、次のようなものがあります。

(function() { 
 
    "use strict"; 
 

 
    angular 
 
    .module('app', []) 
 
    .controller('MainCtrl', MainCtrl) 
 
    .directive('checkEmail', checkEmail); 
 

 
    MainCtrl.$inject = ['$scope']; 
 

 
    function MainCtrl($scope) { 
 

 
    } 
 

 
    function checkEmail() { 
 
    return { 
 
     require: 'ngModel', 
 
     link: function(scope, elm, attrs, ctrl) { 
 
     ctrl.$parsers.unshift(function(viewValue, $scope) { 
 
      var notMatch = viewValue && viewValue != scope.form.email_booking.$viewValue; 
 
      ctrl.$setValidity('notMatch', !notMatch); 
 

 
      return notMatch; 
 
     }) 
 
     } 
 
    } 
 
    } 
 
})();
<!DOCTYPE html> 
 
<html ng-app="app"> 
 

 
<head> 
 
    <script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"></script> 
 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.min.css"> 
 
</head> 
 

 
<body ng-controller="MainCtrl"> 
 
    <div class="col-md-12"> 
 
    <form name="form"> 
 
    <input type="text" id="email_booking" name="email_booking" class="form-control" ng-model="payment_contact.email_booking" /> 
 
    <hr> 
 
    <input type="text" id="confirm_email_booking" name="confirm_email_booking" class="form-control" check-email ng-model="payment_contact.confirm_email_booking" required /> 
 
    <span class="text-danger" ng-if="form.confirm_email_booking.$error.required"> 
 
     Required! 
 
    </span> 
 
    <span class="text-danger" ng-if="form.confirm_email_booking.$error.notMatch"> 
 
     NotMatch! 
 
    </span> 
 
    <pre ng-bind="form.confirm_email_booking | json"></pre> 
 
    </form> 
 
    </div> 
 
</body> 
 

 
</html>

関連する問題