Question

我正在进行角形式验证。除了其他验证之外，我还希望如果我们提交表单而不触及任何字段，那么所有错误消息都应该以表格形式显示。我在名称字段中使用下面的代码，这样如果我们点击提交按钮而不触摸名称字段，然后名称字段中的错误应显示为红色边框，但它不起作用 -

     <div class="form-group" ng-class="{ 'has-error' : myForm.name.$invalid && (myForm.submitted  || myForm.name.$touched ) }">

    <label for="UserName" style="color:#767676" class="" ng-hide="myForm.name.$invalid && (myForm.submitted  || myForm.name.$touched )">Name</label>
                       <label class="error_message_text" ng-show="myForm.name.$invalid && (myForm.submitted  || myForm.name.$touched )">
                            Please enter the name
                        </label><br>
    <input type="text" name="name" class="form-control" ng-class="" ng-model="user.name" required/>

</div>

我在这里创建了一个plunker- https://plnkr.co/edit/33EbFu7pQuZrVyiuwNGZ?p=preview

有人能告诉我如何在点击提交按钮时获得带红色边框的验证错误消息吗？

Answer 1

而不是myForm.submitted使用myForm.$submitted

<div class="form-group" ng-class="{ 'has-error' : myForm.name.$invalid && (myForm.$submitted  || myForm.name.$touched ) }">
    <label for="UserName" style="color:#767676" class="" ng-hide="myForm.name.$invalid && (myForm.$submitted  || myForm.name.$touched )">Name</label>
    <label class="error_message_text" ng-show="myForm.name.$invalid && (myForm.$submitted  || myForm.name.$touched )">
        Please enter the name
    </label><br>
    <input type="text" name="name" class="form-control" ng-class="" ng-model="user.name" required/>
</div>

使用角度验证单击提交按钮时不显示错误消息

1 个答案: