Question

使用AngularJS表单验证时，除了以下部分时，在使用括号

验证选择输入时，它的工作顺利进行

<div class="form-group" ng-class="{'has-error': editDorm.classId.$invalid}">
      <div class="col-sm-10">
        <select class="form-control" ng-model="form.classId" name="classId[]" multiple required>
          <option ng-repeat="class in classes" value="{{class.id}}">{{class.className}}</option>
        </select>
      </div>
    </div>

感谢您的帮助。感谢

Answer 1

您需要使用bracket表示法，将带有sq：括号的元素的名称添加为表单控制器中的键，因此您需要将表单控制器实例中的模态实例称为{{1 }}。如有疑问，请始终在html中打印表单实例，即显示kvp的editDorm['classId[]']。

即：

{{editDorm}}

 ng-class="{'has-error': editDorm['classId[]'].$invalid}"

angular.module('app', []).run(function($rootScope) {
  $rootScope.classes = [{
    id: 1,
    className: 'class1'
  }, {
    id: 2,
    className: 'class2'
  }];
})

.has-error {
  border: 2px solid red;
}

另一个注意事项：使用select的推荐方法是使用ng-options而不是<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="app"> <form name="editDorm"> <div class="form-group" ng-class="{'has-error': editDorm['classId[]'].$invalid}"> <div class="col-sm-10"> <select class="form-control" ng-model="form.classId" name="classId[]" multiple required> <option ng-repeat="class in classes" value="{{class.id}}">{{class.className}}</option> </select> </div> </div> </form> </div>，这很容易使用。

你会这样做：

ng-repeat

带括号的输入的AngularJS验证错误

1 个答案: