多种动态内容投影

Question

需要有关如何进行多个动态内容投影的最佳方法的建议。

Parrent组件模板：

<tabs [count] = 'n'>
    <div tab_1>...</div>
    <div tab_2>...</div>
    ...
    <div tab_n-1>...</div>
    <div tab_n>...</div>
</tabs>

预期的孩子（Tabs）组件模板：

<ng-content select='[tab_1]'></ng-content>
<ng-content select='[tab_2]'></ng-content>
...
<ng-content select='[tab_n-1]'></ng-content>
<ng-content select='[tab_n]'></ng-content>

我试图做这样的事情：

<div *ngFor="let item of [1, 2, ... , n - 1, n]]"> 
    <ng-content select='[tab_{{n-1}}]'></ng-content>
</div>

但是它不起作用，因为ng-content select是静态的，我们在这里不能使用表达式。

我的最终解决方案是在子组件中使用ElementRef，以获取主机的子节点并对其进行操作。但这看起来像jQuery的方法，而不是Angular。