在ng-repeat中重置Formly表单

时间:2016-02-07 21:55:34

标签: angularjs angular-formly

我在ng-repeat中有一个Angular Formly形式。除了重置按钮之外,我已经完成了所有工作。出于某种原因,单击任何重置按钮始终会重置最后一个表单,而不是它应该的那个表单。提交和updateInitialValue()似乎工作正常。

var datasets = [{"label":"IT","curvedLines":{"apply":true},"animator":{"start":0,"steps":7,"duration":3000,"direction":"right"},"idx":0,"data":[{"0":1433156400000,"1":"095.07"},{"0":1435748400000,"1":"097.80"},{"0":1438426800000,"1":"096.72"},{"0":1441105200000,"1":"097.62"},{"0":1443697200000,"1":"097.68"},{"0":1446379200000,"1":"098.49"},{"0":1448971200000,"1":"098.59"},{"0":1451649600000,"1":"098.69"}]},{"label":"Network","curvedLines":{"apply":true},"animator":{"start":0,"steps":7,"duration":3000,"direction":"right"},"idx":1,"data":[{"0":1433156400000,"1":"095.07"},{"0":1435748400000,"1":"097.80"},{"0":1438426800000,"1":"096.72"},{"0":1441105200000,"1":"097.62"},{"0":1443697200000,"1":"097.68"},{"0":1446379200000,"1":"098.49"},{"0":1448971200000,"1":"098.59"},{"0":1451649600000,"1":"098.69"}]},{"label":"Success Rate","curvedLines":{"apply":true},"animator":{"start":0,"steps":7,"duration":3000,"direction":"right"},"idx":2,"data":[[1433156400000,98.58],[1433156400000,null],[1433156400000,95.18],[1433156400000,null],[1435748400000,null],[1438426800000,null],[1441105200000,null],[1443697200000,null],[1446379200000,null],[1448971200000,null],[1451649600000,null]]}];

var options = {"series":{"lines":{"show":true},"curvedLines":{"active":true}},"xaxis":{"mode":"time","tickSize":[1,"month"],"timeformat":"%b %y"},"grid":{"clickable":true,"hoverable":true},"legend":{"noColumns":3,"show":true}};

$.plotAnimator($('#CAGraph'), datasets, options);

这是重复内部的表单声明:

<div ng-repeat="model in vm.models">

这是重置按钮。

<formly-form model="model" fields="vm.fields" options="vm.options[$index]" form="vm.form[$index]">

这是小提琴中的全部内容。

http://jsbin.com/feguvulumo/edit?html,js,output

预先感谢您提供任何帮助!

2 个答案:

答案 0 :(得分:1)

我通过@kentcdodds在Formly gitter聊天(https://gitter.im/formly-js/angular-formly

上得到了一些帮助。

他建议问题是重复表单共享相同的字段配置。

为了解决这个问题,我实现了一个由ng-repeat内部的ng-init调用的函数。它在循环时构建了一个字段对象数组。

function addFields() {
  vm.fields.push(new getFields());
}

然后我改变了<formly-form>上的fields属性,如此

<formly-form model="model" fields="vm.fields[$index]" options="vm.options[$index]" form="vm.form[$index]">

完整解决方案 http://jsbin.com/yanopeyija/1/edit?html,js,output

答案 1 :(得分:0)

我也是角色的新手,但是如果我们将按钮类型更改为重置,通常可以实现这一点:

<button type="reset" >