AngularJs ng-if how i can use it with my scenario

Question

This is my current code where i am displaying sub menus and it works fine.

I need slightly changed behaviour ie show sub menus text based on condition. eg show Menu 1 OR MENU ONE based on condition value which i am getting back from my controller. The same logi

All i need to know How can i use ng-if statement here?

<li><a class="pointer" ng-show="IsTrue" data-ng-click="sum()">Menu 1</a></li>

Answer 1

What you could do is change

<li><a class="pointer" ng-show="IsTrue" data-ng-click="sum()">Menu 1</a></li>

into

<li><a class="pointer" ng-show="IsTrue" data-ng-click="sum()">{{ menu }}</a></li>

and in the controller write the logic

$scope.menu = condition ? "Menu 1" : "Menu One";

Answer 2

this is an option :

<a class="pointer" ng-show="IsTrue" ng-click="selectedMenu='menu1'; sum()">click to vuew
<div ng-if="selectedMenu == 'menu1'"> MENU </div></a>

you can use ng-show too...

Answer 3

Consider using the ng-bind directive as it allows for an expression. Example:

<button ng-init="IsTrue = false" ng-click="IsTrue = !IsTrue">Change</button>
<ul>
  <li><a ng-bind="IsTrue ? 'Menu 1' : 'MENU ONE'"></a></li>
</ul>

edit

Example updated.