我如何遍历表单数组并将其值设置为打字稿中的另一个数组？

Posted 2023-03-25

【中文标题】我如何遍历表单数组并将其值设置为打字稿中的另一个数组？

【英文标题】：How do i iterate through a formarray and set its value to another array in typescript?

【发布时间】：2022-01-23 00:56:41

【问题描述】：

我在表单中有一个 FormArray，FormArray 有一个名为“Foo”的字符串参数。我试着做：

let formArray = this.form.get("Foo") as FormArray;
let formArrayValues : Foo : string[];  //this will be put into the ts model to be sent out.

我不确定如何遍历 FormArray，获取值“Foo”并将其放入我的新数组中。 我试过了：

for (let c of formArray.controls) 
   formArrayValues.push(c.get("Foo"));

但似乎我收到错误消息，说 AbstractControl 的类型中缺少“Foo”。 我在这里有点迷路，我确实四处搜索，但没有找到类似的东西。谢谢

【问题讨论】：

你可以用c.value读取控件的值，而不是c.get("Foo")

【参考方案1】：

您不需要迭代表单数组，您可以像这样简单地访问 FormArray 的值。

formArrayValues = [...formArray.value];

我建议阅读original documentation 以更好地了解您可以使用哪些功能以及如何最大限度地利用表单数组，以避免像本例那样重新发明***场景（例如尝试迭代表单数组控件在您已经可以使用价值时获取价值）

【讨论】：

谢谢。我似乎没有将结果设置为模型有任何错误，因此需要进一步测试。我确实阅读了您指出的文档，但可能是因为我对打字稿语法和一般的“表单”仍然有点陌生，我认为我在该文档中没有看到任何参考您的回答 [...formArray.value]

文档中的引用提到“值”作为表单数组可以访问的属性，三个点称为扩展语法，用于复制数组，您可以谷歌扩展语法并阅读更多信息，希望对您有所帮助。

谢谢！是的，我做了一些测试，似乎数据正在传递给模型并在其余调用中:)。不确定模型本身是否正确，但从屏幕获取数据到调用的困难部分已经完成。谢谢:)。