我很难让ngMessages在ngRepeat循环中工作。请考虑以下示例:
<form name="$ctrl.demoForm.$fc" novalidate>
<div ng-repeat="tag in $ctrl.demoForm.tags track by $index">
<div>
<label>Tag:</label>
<input name="tag{{$index}}" ng-model="tag.value" type="text" ng-pattern="/^[a-z]*$/">
<button ng-click="$ctrl.removeTag($index)">Remove</button>
</div>
<ng-messages for="$ctrl.demoForm.$fc['tag'+$index].$error">
<ng-message when="pattern">Must only contain letters.</ng-message>
</ng-messages>
</div>
<button ng-click="$ctrl.addTag()">Add new tag</button>
</form>
我只是迭代存储在$ctrl.demoForm.tags
中的一系列标签。我知道ng-repeat每次迭代都会创建一个新范围,因此每个标记都是{value: 'tag value'}
之类的对象。
这是与控制器相关的非常基本的东西:
app.controller('DemoCtrl', function() {
this.demoForm = {
tags: [
{value: 'tag 1'},
{value: 'tag 2'}
]
};
this.addTag = function(){
this.demoForm.tags.push({value: ''});
};
this.removeTag = function(index) {
if (this.demoForm.tags.length > index) {
this.demoForm.tags.splice(index, 1);
}
};
});
它工作正常,我可以正常添加和删除标签。但是,当字段出错时会出现问题。如果您尝试删除错误字段 字段,则其值会变得混乱。
奇怪的是,实际上删除了良好的字段,只有在出错时它们的值似乎是不同步的。我在jsbin中添加了一个id
属性来说明问题,你可以在这里找到它:
http://jsbin.com/nifipatojo/edit?html,js,output
有没有人知道发生了什么?
感谢您的帮助。