別の入力に応じて入力を検証するにはどうすればよいですか？

Question

フォームの検証に問題があります。これは、登録ユーザーのパスワード、プロフィール画像、彼の経歴を変更するためのフォームです。その形式では、パスワードは最初に必要ではありませんが、誰かが古いパスワードを書いたときには、新しいパスワードと確認パスワードが必要です。私は例でそれを示します。

今必要な、しかし、私は古いパスワードの入力で何かを書く場合、私は新しいパスワードと確認パスワードが赤くなっていることを必要とされていません。私が持っているコードは次のとおりです。

<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); 
    } 
}}); 

が助けてくれてありがとう！

Answer 1

このために別のカスタムディレクティブは必要ありません。 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が空白でない場合、私は記入するには、このフィールドを必要としている。」と言います