Question

我的模型看起来像这样：

$scope.item = {
    userId: 2,
    bioValues: [{
      name: 'Systolic',
      biometricValue: 120
    }, {
      name: 'Diastolic',
      biometricValue: 80
    }]
  };

我的表格名称是“bioValues [0] .biometricValue，bioValues 1。biometricValue”。

但是当我尝试验证我的表单时，我的字段验证错误的'ng-show'不会被触发。我查看了firebug中的表单对象，并且所有适用的表单错误在空时都被正确标记为无效，但未触发ng-show。

这是plunker。尝试将其中一个输入留空。 ng-show不会触发所需的错误。

有什么想法吗？感谢。

Answer 1

无需将要验证确切名称的字段命名为您要显示的模型。

Here is a working plunker.

我所做的唯一更改是为模板bioValues1和bioValues2中的字段命名。

<强> HTML：

<body ng-controller="MyCtrl">
  <form novalidate name="form">
    <div class="row">
      <input type="text" name="bioValues1" ng-model="item.bioValues[0].biometricValue" required />
      <span class="error" ng-show="form.bioValues1.$error.required">*Required</span>
    </div>
    <div class="row">
      <input type="text" name="bioValues2" ng-model="item.bioValues[1].biometricValue" required />
      <span class="error" ng-show="form.bioValues2.$error.required">*Required</span>
    </div>
  </form>
</body>

<强> JS：

var myApp = angular.module("MyApp", []);

myApp.controller("MyCtrl", function($scope) {
  $scope.item = {
    userId: 2,
    bioValues: [{
      name: 'Systolic',
      biometricValue: 120
    }, {
      name: 'Diastolic',
      biometricValue: 80
    }]
  };

});

如何在angularjs中验证子属性？

1 个答案: