如何在不使用Angular 2中的ngIf的情況下爲同一組件類使用多個HTML模板

Question

所有子項的數據都是相同的，但視圖不同。我知道這可以使用ngIf。但由於HTML行數多需要分開存檔。

Answer 1

使用<ng-content></ng-content>像這樣你就可以（幾乎）達到同樣的事情，例如MyComp是動態模板組件。現在

@Component({ 
    selector: 'my-comp', 
    template: '<ng-content></ng-content>' 
}) 
export class MyComp { ... } 

可以在裏面<my-comp>

<app-root> 

    <my-comp> 
    <h1>Hello World</h1> 
    </my-comp> 

    <my-comp> 
    <div>Angular is awesome</div> 
    </my-comp> 

</app-root>