：場合でも、$有効な有効なCSSを示していますので、ここで

Question

が私のコードではfalse、私は2つのパスワードが一致するかどうかを決定するために、カスタムディレクティブを使用して、ここに私のhtmlは

<!-- confirm password --> 
    <div class="row"> 
     <div class="col-xs-10 col-centered"> 
      <div class="col-md-5 col-xs-12 inputLabels"> 
       <b>Confirm Password:</b> 
      </div> 

      <div class="col-md-5 col-xs-12"> 
       <input type="password" name="confirmPassword" ng-model="boardingData.confirmPassword" class="form-control" required compare-to="boardingData.password"> 
      </div> 
     </div> 
    </div> 

とするかどうかを決定するためのディレクティブですパスワード一致

app.directive('compareTo', function() { 
return { 
    require: "ngModel", 
    scope: { 
     otherModelValue: "=compareTo" 
    }, 
    link: function(scope, element, attributes, ngModel) { 

     ngModel.$validators.compareTo = function(modelValue) { 
      return modelValue == scope.otherModelValue; 
     }; 

     scope.$watch("otherModelValue", function() { 
      ngModel.$validate(); 
     }); 
    } 
}; 

}）;

最後にCSS

input:valid {box-shadow: 0 0 3px rgb(97, 240, 59);} 

Answer 1

ため理由は、有効な入力の内容が[タイプ]属性が一致する場合に特有の擬似クラスです。 https://developer.mozilla.org/en-US/docs/Web/CSS/:validに見ることができます。代わりにあなたが望むのは、ここに見られるようなng-validクラスです。https://docs.angularjs.org/api/ng/directive/form。

さらなるヘルプが必要な場合はお知らせください。