Question

输入字段使用Angular.js获取无效数据时，无法显示错误消息。我在下面解释我的代码。

<form name="billdata" id="billdata"  enctype="multipart/form-data" novalidate>
   <div ng-class="{ 'myError': billdata.type.$touched && bill data.type.$invalid }">
       <input type="number"  class="form-control oditek-form"  ng-model="type" name="type" step="1" min="0" placeholder="Add Type" ng-pattern="/^[0-9]+([,.][0-9]+)?$/">
   </div>
   <div class="help-block" ng-messages="billdata.type.$error" ng-if="billdata.type.$touched">
       <p ng-message="pattern" style="color:#F00;">This field needs only number(e.g-0,1..9).</p>
   </div>
</form>

这里我只需要输入数字作为输入。如果用户输入任何内容而不是数字，则应显示错误消息。这里myError显示输入字段上的红色边框正确显示但是消息未显示应该显示。

Answer 1

    <html>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
    <div ng-app="">
    <form name="myForm">     
   For Text  <input name="myName" ng-model="myName"  ng-pattern="/^[a-zA-Z ]+$/" required>       
    <span style="color: red" ng-show="myForm.myName.$error.required">First Name is required.</span>                                                                        <span style="color: red" ng-show="myForm.myName.$error.pattern">Any other symbol are not allow.</span>
      
    <br />
      For Number 
      
      <input type="number" class="textbox_usr" name="txtmobno" id="txtmobno"  ng-model="txtmobno" ng-minlength="10" ng-maxlength="10" required /><br />
                                                            <span style="color:red" ng-show="myForm.txtmobno.$dirty && myForm.txtmobno.$invalid">
                                                                <span ng-show="myForm.txtmobno.$error.required || myForm.txtmobno.$error.number">Valid Mobile number is required</span>
                                                                <span ng-show="((myForm.txtmobno.$error.minlength || myForm.txtmobno.$error.maxlength) && myForm.txtmobno.$dirty) ">Mobile number should be 10 digits</span>
                                                            </span>
    </form>
      </div>

Answer 2

ng-messages div应该像跟随

<div ng-messages="billdata.type.$error" ng-show="billdata.type.$touched">
  <div ng-message when="pattern">
    <span>This field needs only number(e.g-0,1..9).</span>
  </div>
</div>

无法使用Angular.js

2 个答案: