角度 - コンポーネントの異なるテンプレート

Question

私は、コンポーネント "コース"を持っています。このコンポーネントをリストに使用します。このリストは時には水平であり、いくつかは垂直である。テンプレートファイルのコンポーネント内でダイナミクスを選択できますか？

@Component({ 
    selector: 'course', 
    templateUrl: getTemplateFile() 
}) 

これは素晴らしい機能です。

Answer 1

私はこのチュートリアルでは、あなたは単にあなたの基本コンポーネントを拡張して、テンプレートを上書きすることができます

https://scotch.io/tutorials/component-inheritance-in-angular-2

非常に有用だと思います。これにより、まったく同じ機能を持ちながら異なるテンプレートを持つことができます。

Answer 2

確かに、角度4以降、* ngIf/elseディレクティブがあります。あなたは、このようなテンプレートを切り替えることができます

<div *ngIf="isHorizontal; else verticalTemplate"> 
    <span>horizontal</span> 
</div> 

<ng-template #verticalTemplate> 
    <span>vertical</span> 
</ng-template> 

私は推測、あなたが画面の幅に応じて、水平方向と垂直方向のレイアウトを切り替えたいということ。 ObservableMedia-Serviceを含むhttps://github.com/angular/flex-layoutを見てください。