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

我会省略$ dirty的支票，而是检查$invalid和$touced：

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

AngularJS验证问题

1 个答案: