Wie kann ich einen Eingang abhängig von einem anderen Eingang angularJS validieren?

Question

Ich habe ein Problem beim Validieren meines Formulars. Es ist ein Formular, um das Passwort eines registrierten Benutzers, das Profilbild und die Biographie von ihm zu ändern. In dieser Form wird das Passwort nicht zuerst benötigt, aber wenn jemand das alte Passwort schreibt, benötigt das Formular das neue Passwort und das Passwort bestätigen. Ich zeige es an einem Beispiel.

Im Moment ist nicht erforderlich, aber wenn ich etwas in den Eingang des alten Passwort schreiben Ich brauche, dass das neue Kennwort und Kennwort bestätigen rot. Der Code, den ich habe, ist es:

<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> 

Die erfordern Pass Richtlinie funktioniert aber nur, wenn der Benutzer etwas schreibt in dem Eingang des neuen Passwortes oder Passwort bestätigen. Die confirm-Direktive ist eine Direktive um zu überprüfen, ob beide Passwörter gleich sind (diese Direktive funktioniert). Das erfordert Pass Richtlinie ist:

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

Sie für die Hilfe danken !!

Answer 1

Sie benötigen keine andere benutzerdefinierte Anweisung dafür. Sie können einfach ng-required verwenden. hier Docs: 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" im Grunde sagt, „Ich habe dieses Feld erforderlich ausgefüllt werden, wenn oldPass nicht leer ist.“