AngularJS検証の問題

Question

私はAngularJSディレクティブを使用して、フォームproductFormを検証しようとするので、私は試してみてください。このように

<form id="productForm" name="productForm" novalidate> 
    <div style="width: 100%; margin-top: 15px; float: right; "> 
       <label style="width:103px;float:right" class="col-sm-2" for="ProductName">ProductName: </label> 

       <div style="float:right" class="col-sm-5"> 
        <input ng-required="true" class="form-control" style="float:right" type="text" id="ProductName" name="ProductName" ng-model="modal.ProductName" value="" /> 
       </div> 
       <div style="float:right" class="col-md-7" > 
        <span class="help-block" ng-if="productForm.ProductName.$error.required && productForm.ProductName.$dirty && productForm.ProductName.$touched "> Name is Must</span> 
       </div> 

    </div> 
    <button class="btn" style="background-color: #ed9c28;" type="button" ng-click="Save()" ng-disabled="productForm.$invalid">Save</button> 
</form> 

問題がある：ユーザーがProductNameに触れると、それがフォーカスを失ったときに、必要なメッセージを表示されませんでした（ユーザーの入力時に表示され、入力からテキスト全体をクリアしていますが、入力が空のときにエラーメッセージを表示したい場合）、productForm.ProductName.$touchedをng-ifで実行しようとしましたそれは動作しません、どうすればいいですか？

Answer 1

私は汚い$のチェックを省略し、代わりに$invalidと$toucedをチェックします：

ng-if="productForm.ProductName.$invalid && productForm.ProductName.$touched"