Angularjs输入字段为空或未验证

时间:2015-03-17 13:43:32

标签: javascript angularjs

Plunker

<ul ng-repeat="fields in data">
<li>
  <input type="text" ng-model="fields.field2.i">
</li>

<li>
  <input type="text" ng-model="fields.field2.ii">
</li>

<li>
  <input type="text" ng-model="fields.field2.iii">
</li>
</ul>

如何检查angularjs中是否填写了所有字段?检查ng-model或json的对象?

1 个答案:

答案 0 :(得分:2)

选中此plunker

<!DOCTYPE html>
<html ng-app="plunker">
<head>
   <meta charset="utf-8" />
   <title>AngularJS Plunker</title>
   <script>document.write('<base href="' + document.location + '" />');</script>
   <link rel="stylesheet" href="style.css" />
   <script data-require="angular.js@1.2.x" src="https://code.angularjs.org/1.2.28/angular.js" data-semver="1.2.28"></script>
   <script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
   <form name="form">
      <ul ng-repeat="fields in data">
         <li>
            <input type="text" ng-model="fields.field2.i" required>
         </li>
         <li>
            <input type="text" ng-model="fields.field2.ii" required>
         </li>
         <li>
            <input type="text" ng-model="fields.field2.iii" required>
         </li>
      </ul>
      <button type="button" ng-disabled="form.$invalid" ng-click="save()">Save</button>
   </form>
</body>
</html>

基本上,你应该使用&#39; required&#39;在所有必填字段上,只有在满足所有字段时才允许单击保存按钮。这是验证的基本形式,有关详细信息,请参阅此link