Conditionally place component in Angular


Angularjs is a front end library for create beautiful interactive web application using Nodejs ( JavaScript). If you are familiar with Reactjs , may catch it faster.

conditional place component

In Angular we can place components conditionally, this can be done by

  • Create a property
  • use ngIf

First up all create simple property for enabling and disabling. It can be true or false property.

 enableFeature=flase

Now you can place ngif with in the any tag/component. In our case it is just a h1 tag.

<h1 *ngIf="enableFeature">{{'You slected ' + brandSelected}} </h1> 
What does this means ?

The heading will only show up if the enableFeature is set to true

Keep reading Angular posts

Published by

Manoj

A developer,teacher and a blogger obsessed with Python,Dart and open source world from India

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 )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.