angular - 围绕组件的角度形式

Question

我有一个这样的场景

我需要一个包裹在组件周围的表格

和 HTML 结构应如下所示：

<form #f="ngForm" (ngSubmit)="clickForm(f)">
   <app-component-1></app-component-1>
   <app-component-2></app-component-2>
   <button type="submit">Submit</button>
</form>

每个组件都有特定的输入集，整个结构如下所示：

<form #f="ngForm" (ngSubmit)="clickForm(f)">
   <app-component-1>
        <input type="text" name="name" #name="ngModel" ngModel required />
        ..so on upto 10 inputs
   </app-component-1>
   <app-component-2>
        <input type="text" name="name2" #name2="ngModel" ngModel required />
        ..so on upto 10 inputs
   </app-component-2>
   <button type="submit">Submit</button>
</form>

但是表单验证不起作用。和表格状态我们总是有效的。请问有什么建议吗？