[angularjs] Angular ng-if not true

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.

Just use for True:

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

and for False:

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

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>

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

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

use this

ng-if="area == false"

OR

ng-if="area == true"

this may help someone

Use like this

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