让父NgForm提交所有子表单

Question

我在Angular 5中有一个表单，结构如下： 有许多行，每行包含有关单个实体的数据。这些行使用模板侧表单验证，并具有保存实体的提交处理程序。

所有这些行都以更大的形式包装，表示我们关心的实体集合。

现在，我希望用户能够按下一个按钮，该按钮将提交所有子窗体以便于使用。我可以从父级调用所有提交处理程序，但这不会触发模板的表单验证。有没有办法让父表单触发所有子表单的提交方式，就像用户按每行上的保存一样？

感谢。

Answer 1

我已经找到了部分解决方案，但我不打算将其标记为已回答，因为我觉得有/应该是更好的方法。

我在子表单中添加了模板名#taskForm="ngForm"。然后在子表单中添加了@Input() submit: boolean;和@ViewChild('taskForm') taskForm: FormGroupDirective;。

然后我扩展了组件以实现OnChanges并添加了以下生命周期函数

ngOnChanges() {
  if (this.submit === true) {
    this.taskForm.ngSubmit.emit();
    this.submit = false;
  }
}

父节点只是迭代ngFor子节点，并在提交父表单时将submit输入参数设置为true。这基本上可以实现我想要的，但它仍然感觉有点hacky。

编辑： 在此处可以找到以编程方式提交表单的代码：https://stackoverflow.com/a/38054632/4951118