我可以 select ng-content 在 ng-container（或其他）中吗？

Question

我有一个带有ng-content选择特定元素的组件，但是当我将元素包装在ng-container时，它不会呈现。

我需要ng-content的 select 是特定的，这样我就可以排除其他元素的呈现，这样我就可以保持代码的清洁和预期。

成分：

<ng-content select="input"></ng-content>

内容：

<input id="1" />
<input id="2" />
<ng-container *ngIf="condition"> <!-- Condition has a thruthy value -->
    <input [id]="item + 2" *ngFor="let item of [1, 2, 3, 4]" />
</ng-container>

Output

<input id="1" />
<input id="2" />

预计 output

<input id="1" />
<input id="2" />
<input id="3" />
<input id="4" />
<input id="5" />
<input id="6" />

我尝试使用ng-container和ng-template ，但似乎都不起作用。

有谁知道如何解决这个问题，或者是否有可能解决这个问题？

Answer 1

使用ngProjectAs属性完成此操作

<ng-container ngProjectAs="input" *ngIf="true"> <!-- Condition has a thruthy value -->
  <input [id]="item + 2" *ngFor="let item of [1, 2, 3, 4]" />
</ng-container>

<ng-content select="input"></ng-content>