Javascript Angular2组件，在循环中渲染2个tr元素

我需要编写一个具有如下模板的组件：

<tr>...</tr>
<tr>...</tr>

<table>
<tbody>
<tr>...</tr>
<tr>...</tr>
</tbody>
<table>

我尝试了以下方法：

<table>
<tbody>
<spot-row *ngFor="let spot of spots" [spot]="spot"></spot-row>
</tbody>
<table>

但这产生了一个错误

错误：./SpotRowComponent类SpotRowComponent-inline中的错误 模板：0:0原因：未能在“节点”上执行“appendChild”： 此节点类型不支持此方法

然后我尝试了

template

<table>
<tbody>
<template spot-row *ngFor="let spot of spots" [spot]="spot"></template>
</tbody>
<table>

但这也给了我一个错误

错误：模板分析错误：嵌入模板上的组件： SpotRowComponent（“[错误->] ））

我搜索了一下，发现

• 这仅仅是一个tr
• 当问题询问tr要素时，可接受的答案是 关于td元素
• 它将呈现一个额外的div元素

---

根据评论提出的建议，未经测试

组件选择器：

[spot row]

组件模板：

<tr>...</tr>
<tr>...</tr>

。。。
...

HTML:

<table>
   <tbody *ngFor="let spot of spots" spot-row [spot]="spot"></tbody>
<table>

这应产生：

<table>
   <tbody>
     <tr>...</tr>
     <tr>...</tr>
   </tbody>
   <tbody>
     <tr>...</tr>
     <tr>...</tr>
   </tbody>
   ...
</table>

...
...
...
...
...

---

哪个是有效的（在

中有多个

）。

也许您可以使用

作为包装元素？应该是有效的HTML。（拆下外部

）t车身裙板不完美，但仍在工作。模板aproach将生成一个错误，如我的问题中所述。@wertzui抱歉，您的问题中遗漏了该部分。

<table>
   <tbody *ngFor="let spot of spots" spot-row [spot]="spot"></tbody>
<table>

<table>
   <tbody>
     <tr>...</tr>
     <tr>...</tr>
   </tbody>
   <tbody>
     <tr>...</tr>
     <tr>...</tr>
   </tbody>
   ...
</table>