angular - 剑道 : Insert a FormGroup at a top into a FormArray

标签 angular kendo-grid angular-reactive-forms formarray formgroups

问题陈述:

在下面的 stackblitz 演示中,我可以在单击 Add 按钮并触发 (模糊)时在网格的开头动态插入 FormGroup 来自一个控件的事件,用于更新共享相同 rowIndex 的另一个控件的值。现在的问题是,如果我插入多个 formGroups 并在任何新添加的 FormGroups 上触发 (blur) 事件,它会更新其他值控件也有不同的 rowIndex

重现问题的步骤:

  • 打开下面的演示链接。
  • 通过单击“添加”按钮添加多行(2 行)。
  • 在第二个新添加的行的名称字段中输入值并聚焦。
  • 它更新新添加的行中的年龄字段,而不是仅更新第二行中的年龄字段。

Stackblitz 演示: https://stackblitz.com/edit/angular-oitz5j-4uezqr

要求:

在特定行的任何名称字段上制表,同一行上的年龄字段应显示随机数而不影响其他行。

到目前为止我尝试了什么?

  • 尝试使用数组 unshift()方法但出现错误

    Property 'unshift' does not exist on type 'FormArray'

  • 尝试使用 FormArray.insert()方法。如果我们想在特定索引处添加一个 FormGroup,它将起作用。但是它无法在 FormArray 的顶部动态插入多个 FormGroups

更新:以上问题在没有 Kendo Grid 的情况下工作正常。请检查下面的演示。

演示: https://stackblitz.com/edit/angular-oitz5j-2a31gs

github/stackoverflow 中的相关问题:

https://github.com/angular/angular/issues/16322

Angular - Form Array push specific index

注意:如果我们要在网格的末尾添加控件,它会像冠军一样工作。请检查下面的演示,它在最后添加控件时运行良好。

演示: https://stackblitz.com/edit/angular-oitz5j-aszrjq

最佳答案

对于那些想在 FormArray 中动态插入元素的人,然后使用索引为 0 的 Insert。

this.formName.controls.FieldNameArray.insert(0,[...])

https://angular.io/api/forms/FormArray#insert .

关于angular - 剑道 : Insert a FormGroup at a top into a FormArray,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58105539/

相关文章:

angular - 响应式表单 - 将字段标记为已触摸

html - Ionic 2 占位符文本样式

Angular 2 : Select dropdown not selecting option despite "selected" attribute

javascript - 如何使用 KendoDetailInit 函数从另一个网格的不同行获取不同的网格作为子级

javascript - Kendo网格表扩展删除表数据

Angular2动态重复输入字段

Angular Reactive Form 选择选项链接到另一个输入不会改变

Angular 2/4 : How to check length of input's value using directive?

javascript - 即使文件存在,Angular 2 也看不到该文件(使用 Angular-cli)

javascript - Kendo UI 中的嵌套数据源