CODEWITHSUNDEEP
angularif-statementangular2-templatengfor
Ehsan Ali
Ehsan Ali

Reputation: 1432

How to use if-else with string in angular2 expression

I wanna to generate html code like below by *ngFor into angular 2 expression.

<ol class="breadcrumb">
  <li><a href="#">Home</a></li>
  <li><a href="#">Library</a></li>
  <li class="active">Data</li>
</ol>

I use this code but it's not true:

<ol class="breadcrumb">
    <li *ngFor="let item of siteMap; let isLast = last" [class.active]="isLast">
        {{isLast == true ? item : "<a href='#'>"+ item +"</a>"}}
    </li>
</ol>

What should I do?

Upvotes: 1

Views: 1870

Answers (2)

HackAfro
HackAfro

Reputation: 720

This should work for you.

<ol class="breadcrumb">
  <li *ngFor="let item of siteMap; let isLast = last">
     <a *ngIf="!isLast; else notLast" href="#">{{item}}</a>
     <ng-template #notLast>{{isLast ? item: ''}}</ng-template>  </li>
</ol>.

Using *ngIf and *ngFor on the same element will throw an error.

Upvotes: 2

Rahul Singh
Rahul Singh

Reputation: 341

This will work for you.

<ol class="breadcrumb">
  <li *ngFor="let item of siteMap; let isLast = last">
    <a *ngIf="!isLast" href="#">{{item}}</a>
    {{isLast ? item: ''}}
  </li>
</ol>

Upvotes: 2

Related Questions