我有一个看起来像这样的模型:
$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 上未触发所需的错误。
有什么想法吗？谢谢。
最佳答案
无需将要验证的字段命名为与要显示的模型完全相同的名称。
我所做的唯一更改是将模板中的字段命名为 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
}]
};
});
关于javascript - 如何验证 angularjs 中的子属性？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/20749122/