在 ng-repeat 中重置 Formly 表单

Question

我在 ng-repeat 中有一个 Angular Formly 表单。除了重置按钮外，我已经按照我的预期一切正常工作。出于某种原因，单击任何重置按钮总是会重置最后一个表单，而不是它应该重置的那个。提交和 updateInitialValue() 似乎工作正常。

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

这是 repeat 中的表单声明：

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

这里是重置按钮。

<button type="button" class="btn btn-default" ng-click="vm.options[$index].resetModel()">Reset</button>

这是 fiddle 中的全部内容。

在此先感谢您提供的任何帮助！

Answer 1

我也是angular的新手，但通常如果我们将按钮类型更改为重置就可以实现：

<button type="reset" >

Answer 2

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

的帮助下解决了这个问题

他认为问题在于重复的表单共享相同的字段配置。

为了修复它，我在 ng-repeat 中实现了一个由 ng-init 调用的函数。它在循环时构建一个字段对象数组。

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

然后我像这样更改了 <formly-form> 上的字段属性

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

Resetting a Formly form within an ng-repeat