Angular2:在host元素旁边插入组件元素

时间:2016-03-07 15:46:34

标签: angular host next inject siblings

Angular2是否可以让组件元素将NEXT插入到它的主机元素中?我知道,DynamicComponentLoader可以做到这一点。但我想告诉Angular2在我的组件类或编译模板中这样做。

为什么我需要它? 我已经构建了一个从树数据结构加载的递归表组件。 这里递归的问题是Angular2不能替换我的host元素,HTML表不会忽略未知的嵌套标记。结果是整个表格布局中断。

以下是生成的标记:

<table>
 <tbody class="my-component"> <!-- this works fine so far -->
  <tr>
   <td>Level 1</td>
  </tr>
  <!-- first level descent -->
  <my-component> <!-- Here is the problem. Breaks the table -->
   <tr>
    <td>Level 2</td>
   </tr>
   <!-- next level descent -->
   <my-component> <!-- i dont't want it to nest. Should add as sibling of host -->
    <tr>
     <td>Level 3</td>
    </tr>
   </my-component>
  </my-component>
 </tbody>
</table>

以下是它的样子:

<table>
 <tbody class="my-component">
  <tr>
   <td>Level 1</td>
  </tr>
  <!-- first level descent -->
  <my-component></my-component> <!-- No nesting. Won't break the table -->
  <tr>
   <td>Level 2</td>
  </tr>
  <!-- next level descent -->
  <my-component></my-component>
  <tr>
   <td>Level 3</td>
  </tr>
 </tbody>
</table>

我希望你们能解决我的问题。如果没有,我会投入一些时间并创造一个掠夺者。

提前致谢。

修改:Here是一个更好的例子

0 个答案:

没有答案