是否可以在组件模板中重用<ng-content> </ng-content>? Angular2

时间:2015-12-25 09:02:47

标签: angular angular2-template

我很好奇有没有办法在组件中重复使用两次 ng-content ?或者将它分配给组件构造函数中的变量?

类似的东西:

&#13;
&#13;
@Component({
    selector: "component"
})
@View({
    template: `<ng-content></ng-content> and again <ng-content></ng-content>`
})
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:8)

ng-template

的帮助下还有另一种方法

ng-content包裹在ng-template内,并将ngTemplateOutletng-container

一起使用

示例:

<ng-container *ngIf="YourCondition" *ngTemplateOutlet="content"></ng-container>
<ng-container *ngIf="!YourCondition" *ngTemplateOutlet="content"></ng-container>

<ng-template #content><ng-content></ng-content></ng-template>

将此用作,

<my-component>Anything</my-component>

答案 1 :(得分:3)

是的,我也发现了这一点。

<my-component> <div content-a> A </div> </my-component>

并在组件中:

<ng-content select="[content-a]"></ng-content>