74

Why doesn't this work.

<li ng-if="!area"></li>

Feels a bit illogical since

<li ng-if="area"></li>

works just fine.

'area' is defined in scope as true/false Any workarounds for this? I would prefer not to use ng-show/ng-hide since both of them renders items in DOM.

Improve this question
7
  • 8
    It should work just fine the way you do it, do you have any more code examples? Commented Oct 8, 2014 at 21:06
  • 2
    Show your code where you define area in your controller. I suspect area is in fact truthy, not necessarily false. Commented Oct 8, 2014 at 21:20
  • 2
    possible duplicate of : <stackoverflow.com/questions/22967847/…> ? <-- where the comments and answers were related to evaluating a string vs a boolean. Commented Apr 29, 2015 at 15:43
  • 1
    possible duplicate of How do I negate the parameter for AngularJS ng-if directive? Commented Jun 3, 2015 at 18:31
  • 2
    console.log($scope.area) and see if maybe the boolean true/false is maybe a string of "true/false" ;-) Commented Jun 14, 2015 at 13:13

6 Answers 6

Reset to default
90

use this

ng-if="area == false"

OR

ng-if="area == true"

this may help someone

Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

Use ng-if="area==0" // False
8

Use like this

<div ng-if="data.IsActive === 1">InActive</div>
<div ng-if="data.IsActive === 0">Active</div>
Improve this answer

Comments

6

Just use for True:

<li ng-if="area"></li>

and for False:

<li ng-if="area === false"></li>
Improve this answer

1 Comment

<li ng-if="!area"></li> also works!
3

try this:

<div ng-if="$scope.length == 0" ? true : false></div>

and show or hide

<div ng-show="$scope.length == 0"></div>

else it will be hide

-----------------or--------------------------

if you are using $ctrl than code will be like this:

try this:

<div ng-if="$ctrl.length == 0" ? true : false></div>

and show or hide

<div ng-show="$ctrl.length == 0"></div>

else it will be hide

Improve this answer

Comments

1

you are not using the $scope you must use $ctrl.area or $scope.area instead of area

Improve this answer

Comments

0

In angular 1, you can use ng-show and ng-hide.In your case, you would use ng-hide. For example:

<li ng-hide="area"></li>
Improve this answer

1 Comment

The side-effect to this approach is that ng-hide will keep the elements in the dom, while ng-if does not render them at all.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.