La documentazione ( https://angular.io/guide/template-syntax#!#star-template ) fornisce il seguente esempio. Supponiamo che abbiamo un codice modello come questo:
<hero-detail *ngIf="currentHero" [hero]="currentHero"></hero-detail>
Prima che venga reso, sarà "sgrassato". Cioè, la notazione asterix verrà trascritta nella notazione:
<template [ngIf]="currentHero">
<hero-detail [hero]="currentHero"></hero-detail>
</template>
Se "currentHero" è vero, questo verrà reso come
<hero-detail> [...] </hero-detail>
Ma cosa succede se si desidera un output condizionale come questo:
<h1>Title</h1><br>
<p>text</p>
.. e non vuoi che l'output sia racchiuso in un contenitore.
Puoi scrivere la versione senza zucchero direttamente in questo modo:
<template [ngIf]="showContent">
<h1>Title</h1>
<p>text</p><br>
</template>
E questo funzionerà benissimo. Tuttavia, ora abbiamo bisogno di ngIf per avere parentesi [] invece di un asterix *, e questo è confuso ( https://github.com/angular/angular.io/issues/2303 )
Per tale motivo è stata creata una diversa notazione, in questo modo:
<ng-container *ngIf="showContent"><br>
<h1>Title</h1><br>
<p>text</p><br>
</ng-container>
Entrambe le versioni produrranno gli stessi risultati (verrà visualizzato solo il tag h1 e p). Il secondo è preferito perché puoi usare * ngIf come sempre.
<template>
quando viene utilizzato senza direttive.<template>
produrrebbe solo<!--template bindings={}-->
in questo caso.