If-Then-Else construction In Angular

In Angular, using ngIf structural directive, we can achieve if-then-else functionality like below:

myComponent.html:

<p *ngIf=“myProperty ; else elseTemplate”>

This element is rendered if myProperty is true

</p>

<ng-template #elseTemplate>

<p>

This element is only rendered if myProperty is false

</p>

</ngTemplate>

myComponent.ts

export myComponent {

 myProperty: boolean = false;

}

==============================

 

second example:

 

<ng-template #thenTemplate>

  <p>

    This element is only rendered if myProperty is false

  </p>

</ngTemplate>

<ng-template #elseTemplate>

  <p>

    This element is only rendered if myProperty is false

  </p>

</ngTemplate>

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

w

Connecting to %s