如何根據另一個輸入angularJS驗證輸入？

我有一個問題驗證我的表單。這是一種改變註冊用戶的密碼，個人資料圖片和他的傳記的形式。在這種形式下，密碼不是首先要求的，但是當有人寫下舊密碼時，表格需要新密碼和確認密碼。我通過一個例子來展示它。如何根據另一個輸入angularJS驗證輸入？

現在不是必需的，但如果我在舊密碼輸入寫的東西，我需要新密碼和確認密碼變成紅色。我的代碼是：

<div class="form-group"> 
      <label for="oldpassword" class="cols-sm-2 control-label">Old Password</label> 
      <div class="cols-sm-10"> 
       <div class="input-group"> 
        <span class="input-group-addon"><i class="fa fa-lock fa-lg" aria-hidden="true"></i></span> 
        <input type="password" class="form-control" name="oldpassword" id="oldpassword" 
          placeholder="Enter your actual password" ng-model="oldPassword"/> 
       </div> 
      </div> 
     </div> 



     <div class="form-group"> 
      <label for="password" class="cols-sm-2 control-label">New Password</label> 
      <div class="cols-sm-10"> 
       <div class="input-group"> 
        <span class="input-group-addon"><i class="fa fa-lock fa-lg" aria-hidden="true"></i></span> 
        <input type="password" class="form-control" name="password" id="password" 
          placeholder="Enter your new password" 
          ng-model="newPassword" pattern="^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" require-pass/> 
       </div> 
      </div> 
     </div> 

     <div class="form-group"> 
      <label for="confirm" class="cols-sm-2 control-label">Confirm Password</label> 
      <div class="cols-sm-10"> 
       <div class="input-group"> 
        <span class="input-group-addon"><i class="fa fa-lock fa-lg" aria-hidden="true"></i></span> 
        <input type="password" class="form-control" name="confirm" id="confirm" 
          placeholder="Confirm your new password" ng-model="confirm" require-pass confirm-directive 
          /> 
       </div> 
      </div> 
     </div>

的需要通指令的作品，但只有當用戶寫的東西在新的密碼輸入或確認密碼。 confirm-directive是一個指令，用於檢查兩個密碼是否相等（該指令有效）。要求通過指令是：

app.directive('requirePass', function() { 
return { 
    require: 'ngModel', 
    link: function (scope, element, attr, mCtrl) { 
     function myValidation(value) { 
      var oldPass = $('#oldpassword').val(); 
      console.log(oldPass); 
      if (oldPass!="") { 
       mCtrl.$setValidity('charE', false); 
      } else { 
       mCtrl.$setValidity('charE', true); 
      } 
      return value; 
     } 

     mCtrl.$parsers.push(myValidation); 
    } 
}});

謝謝你的幫助！

來源

2016-05-31 Ary

您不需要另一個自定義指令。您只能使用ng-required。文檔瀏覽：https://docs.angularjs.org/api/ng/directive/ngRequired

<input id="newPass" ng-required="oldPass" type="text" ng-model=... /> 
<input id="newPassConfirm" ng-required="oldPass" type="text" ng-model=... />

ng-required="oldPass"基本上說：「我需要這個字段填寫，如果oldPass不爲空。」

來源

2016-05-31 16:02:24 Kyle

哦，謝謝你！ – Ary

如何根據另一個輸入angularJS驗證輸入？

回答

相關問題