inline conditionals in angular.js

angularjs if-statement ternary-operator
user1469779 picture user1469779 · Jan 4, 2013 · Viewed 301.9k times · Source

I was wondering if there is a way in angular to conditionally display content other than using ng-show etc. For example in backbone.js I could do something with inline content in a template like:

<% if (myVar === "two") { %> show this<% } %>

but in angular, I seem to be limited to showing and hiding things wrapped in html tags

<p ng-hide="true">I'm hidden</p>
<p ng-show="true">I'm shown</p>

What is the recommended way in angular to conditionally show and hide inline content in angular just using {{}} rather than wrapping the content in html tags?

Answer

2Toad picture 2Toad · Feb 22, 2014

Angular 1.1.5 added support for ternary operators:

{{myVar === "two" ? "it's true" : "it's false"}}

Related questions

Angularjs if-then-else construction in expression

Can I somehow use if-then-else construction (ternary-operator) in angularjs expression, for example I have function $scope.isExists(item) that has to return bool value. I want something like this, <div ng-repeater="item in items"> <div>{{item.…

Read More
if else statement in AngularJS templates

I want to do a condition in an AngularJS template. I fetch a video list from the Youtube API. Some of the videos are in 16:9 ratio and some are in 4:3 ratio. I want to make a condition like this: if …

Read More
how to check for null with a ng-if values in a view with angularjs?

i have this situation <div ng-repeat="test in current"> <div ng-if="test.view == null"> <i class="icon ion-checkmark"></i> </div> </div> but test.view== null doesn't work, neither …

Read More