Make a render condition with AngularJS

Update for angularjs 1.1.5 and above users (not supported in 1.0.7):

Related commit:
https://github.com/angular/angular.js/commit/2f96fbd17577685bc013a4f7ced06664af253944

Angular now have a conditional rendering directive: ngIf.

Usage:

<div ng-if="conditional_expression"></div>

Note that when an element is removed using ngIf its scope is destroyed and a new scope is created when the element is restored

Documentation: directive-ngIf

For legacy angularjs users:

ngShow directive conditionally hides/shows the element. This is going to be changed in one of the new stable releases, it is now available in the unstable release as with 1.1.5.

If you want to conditionally add/remove items on DOM, use can use ngSwitch.

<div ng-switch="showMe">
    <div ng-switch-when="true">Hello!</div>
</div>

Actually, this directive has been created for handling cases for more than 1, but you can use it that way too. See this answer for examples of more sophisticated usages.

Leave a Comment

Hata!: SQLSTATE[HY000] [1045] Access denied for user 'divattrend_liink'@'localhost' (using password: YES)