renderowania <ng-content> kątowego 2 razy

Question

Mam kodu jak ten

<template *ngIf='mobile'> 
    <div class='wrapper'> 
    <div class='nav'> 
     <ng-content></ng-content> 
    </div> 
    </div> 
</template> 

<template *ngIf='desktop'> 
    <ng-content></ng-content> 
</template> 

Jednakże kątowa 2 powoduje ng zawartości tylko jeden raz. Czy istnieje sposób na sprawne działanie tej sprawy bez zbytniego hakowania?

Answer 1

zmiana kątowa 5

ngOutletContext został przemianowany na ngTemplateOutletContext

Zobacz także https://github.com/angular/angular/blob/master/CHANGELOG.md#500-beta5-2017-08-29

oryginalny

można przekazać treść jako szablon, a następnie można go uczynić wiele razy.

<parent> 
<template> 
    projected content here 
</template> 
</parent> 

W rodzica

<ng-container *ngIf='mobile'> 
    <div class='wrapper'> 
    <div class='nav'> 
     <template [ngTemplateOutlet]="templateRef"></template> 
    </div> 
    </div> 
</ng-container> 

<template *ngIf='desktop'> 
    <template [ngTemplateOutlet]="templateRef"></template> 
</template> 

export class ParentComponent { 
    constructor(private templateRef:TemplateRef){} 
} 

Można również przekazać dane do szablonu związać z prognozowanego treści.

<ng-container *ngIf='mobile'> 
    <div class='wrapper'> 
    <div class='nav'> 
     <template [ngTemplateOutlet]="templateRef" [ntOutletContext]="{ $implicit: data}"></template> 
    </div> 
    </div> 
</ng-container> 

<ng-container *ngIf='desktop'> 
    <template [ngTemplateOutlet]="templateRef" [ntOutletContext]="{ $implicit: data}"></template> 
</ng-container> 

export class ParentComponent { 
    @Input() data; 

    constructor(private templateRef:TemplateRef){} 
} 

a następnie używać go jak

<parent [data]="data"> 
<template let-item> 
    projected content here {{item}} 
</template> 
</parent> 

Zobacz również My own Angular 2 Table component - 2 way data binding