在Angular2 +，我怎麼能代替我自己的分量<tr>不與DOM結構/ CSS

Question

考慮與人行，並且結果在測試下表片段干擾：

<tr> 
    <td>John Doe</td> 
    <td>18</td> 
</tr> 
<tr> 
    <td>Jane Dober</td> 
    <td>28</td> 
</tr> 
<my-own-tr-component></my-own-tr-component> 

在上面的表格末尾，我想添加最後的<tr>，這將是我的自定義組件，它將在其他地方重複使用。

的問題是，我的自定義組件插入DOM元素的表是不是<tr>打破了DOM，造型等

我怎樣才能使角不插入自己的主元素，只是顯示<tr>從我的自定義組件？

我不想使用屬性選擇器，因爲它看起來像一個黑客攻擊，並且反對Angulars風格指南文檔。

Answer 1

給該組件的table-row顯示屬性：

:host { display: table-row; } 

這將使其行爲對所有實際用途，如<tr>。準確地說，它是在用戶代理樣式表中定義的display: table-row屬性，它使<tr>充當表格行。