angularjs $有效不在字段上工作

时间:2014-11-19 11:32:46

标签: javascript jquery html html5 angularjs

我是angularjs的新手。

我的表单上有2个按钮,其中一个是Save,另一个是Test Connection按钮。

<td align="left" colspan="0" >
    <input class="form-control" title="Specifies the IP address of the SIP trunk ethernet connection." placeholder="xxx.xxx.xxx.xxx"  
           style="display: inline-block;display:block;white-space: nowrap;overflow: hidden;" type="text" 
            name="pabxipaddress" id="pabxipaddress" ng-model="userSetup.pabxipaddress" required ng-pattern='patternPresent' >
</td>
<td>
    <span class="error" ng-show="(testIPOfficeFlag || submitted) && userSetupForm.pabxipaddress.$error.required">
        <label style="color: red;">Required!</label>
    </span>
    <span class="error" ng-show='(testIPOfficeFlag || submitted) && userSetupForm.pabxipaddress.$error.pattern'>
        <label style="color: red;">Invalid IP Address!</label>
    </span>
</td>

当我喜欢的时候,在我的JS文件中 $scope.userSetup.pabxipaddress.$valid进行了一些动态测试,它给了我

TypeError: Cannot read property '$valid' of undefined

当我像$scope.userSetup.pabxipaddress一样提醒时,它会正确显示数据。

如何检查单个字段是否正确并传递附加到其上的所有约束。

1 个答案:

答案 0 :(得分:1)

有效属性不属于模型值...尝试

$scope.userSetupForm.postdail.$valid

其中userSetupForm是表单的名称,postdailinput元素的名称。


&#13;
&#13;
var app = angular.module('my-app', [], function() {

})

app.controller('AppController', function($scope) {

  $scope.check = function() {
    $scope.validity = {
      field1: $scope.myform.myfield1.$valid,
      field2: $scope.myform.myfield2.$valid,
      field3: $scope.myform.myfield3.$valid
    }
  };
})
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="my-app" ng-controller="AppController">
  <form name="myform" novalidate>
    <div>
      <input type="number" name="myfield1" ng-model="formdata.myfield1" required class="numbers-only-for" minvalue="1" maxvalue="45">
    </div>
    <div>
      <input type="text" name="myfield2" ng-model="formdata.myfield2" required>
    </div>
    <div>
      <input type="text" name="myfield3" ng-model="formdata.myfield3" required>
    </div>
    <button ng-click="check()">Check</button>
  </form>
  <pre>{{formdata | json}}</pre>
  <pre>{{validity | json}}</pre>
</div>
&#13;
&#13;
&#13;