Angular 2 template - if elseif else

Question

Is there any way to use if elseif else structure in Angular 2 template?

This is if else example:

[text]="company ? company.name : 'Select a company'"

I need add elseif to it.

no. Angular allows only `if-else` if you want to go for this you can use `ngSwitch` — Aravind, Jan 19 '18 at 08:44
Look at this answer and discussion: https://stackoverflow.com/a/45878721/3710672 — Iaroslav, Jan 19 '18 at 08:47
[text]="company?company.name=='My Company'? 'the best company':company.name:'Select a company'" — Eliseo, Jan 19 '18 at 10:26

score 2 · Answer 1 · answered Jan 19 '18 at 11:26

Angular doesn't have if elseif else behaviour yet but you can achieve the same behaviour like below

<!-- showing number divisible by 2 -->
<div *ngIf="number_divide_by(2);else else_if_content1">
  Show result of if_content
</div>
<!-- Showing number divisible by 3 -->
<ng-template #else_if_content1>
  <span *ngIf="number_divide_by(3);else else_if_content2">
   Show result of else_if_content1</span>
</ng-template>
<!-- Showing number divisible by 5 -->
<ng-template #else_if_content2>
  <span *ngIf="number_divide_by(5);else else_if_content3">
   Show result of else_if_content2</span>
</ng-template>
<!-- Showing rest of the number -->
<ng-template #else_if_content1>
  <span>Show result of else_content</span>
</ng-template>

Hope this will resolve your effort.

This apparently doesn't work if the conditions past the first (else_if_contentX) use an if..then..else statement — Lindenk, Oct 28 '19 at 17:39

Angular 2 template - if elseif else

1 Answers1