Angular - components of different templates

Question

I have a component course. I use this component in the list. This list is sometimes horizontal and several times vertical. Can I select the dynamics inside a component in a template file?

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

Something like this would be a great feature!

Answer 1

I think this tutorial is very useful.

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

You can simply expand the base component and overwrite the template. This allows you to have different components with the same functionality, but with different templates.

Answer 2

, angular 4 * ngIf/else. :

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

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

, . , https://github.com/angular/flex-layout, ObservableMedia-Service.