我在表格中有一个*ngFor
子行组件,我需要用FormGroup包装它。 像这样。
<tr [formGroup]='dependentForm'>
<td>
<input type="text" formControlName="first_name">
</td>
<td>
<input type="text" formControlName="last_name">
</td>
<td>
<input type="text" formControlName="dob">
</td>
</tr>
但是我无法弄清楚如何从父模板加载组件,而不会使标题列的对齐出现问题。
我尝试使用元素选择器和属性选择器,但无论哪种方式都似乎存在障碍。如果我使用属性选择器
<tr dependent-row>
,并从子级中删除tr
,那么我就无法在我的input
周围包装任何东西来分配formGroup
,否则它会破坏列。如果我使用元素选择器<dependent-row></dependent-row>
,并像上面的示例一样将tr
放在子组件中,那只会通过在一行中列出所有tr
来使表格变得更糟。我希望我已经足够清楚地描述了我的问题。谢谢您的关注!
更新
这里是使用属性选择器的示例。
dependent-row
组件中的tr
标签会扰乱表格列,但我需要添加一个formGroup
,所以我不确定如何正确处理此问题。
这里是使用元素选择器的替代方法。