CODEWITHSUNDEEP
javascripthtmlangularjs
user3189828
user3189828

Reputation: 185

Add an HTML element conditionally

I am trying to add an HTML element into a div, only after checking the condition. I tried with conditionally adding a directive and append element, but I couldn't.

Upvotes: 1

Views: 2636

Answers (2)

Deniz Saner
Deniz Saner

Reputation: 437

You have two options: The ng-show and the ng-if directive:

ng-show

The ng-show directive shows or hides elements respectively by adding or removing the ng-hide CSS class, to or from the element.

Basic example:

<div id="someDiv" class="myDivClass" ng-show="myCtrl.user.attribute == true"></div>

ng-if

The ng-if directive actually deletes and recreates the element. Note that an element with the ng-if directive has its own scope, which is destroyed when the element is deleted from the DOM.

Basic example:

<div id="someDiv" class="myDivClass" ng-if="myCtrl.user.attribute == true"></div>

Upvotes: 2

Anton
Anton

Reputation: 2636

You may try the following:

<div>
    <span ng-if="x == 1">Conditional element</span>
</div>

Upvotes: 0

Related Questions