AngularJS ng-if with angular expression

Question

View:

<html ng-app="myApp">
....
  <body>

    <div ng-controller="myCtrl">

      <p>Current user {{loggedOnUser}}</p>

      <div ng-if="user.name == {{loggedOnUser}}" ng-repeat="user in users">
        <p>Should display</p>
      </div>

    </div>

  </body>

</html>

Controller:

angular.module("myApp", [])
  .controller("myCtrl", function($scope){
    $scope.loggedOnUser = "xxx"; // for testing purpose
    $scope.users = [
      {
        name : "xxx",
        age: "25"
      },
      {
        name : "yyy",
        age: "26"
      }
    ];
 });

How to use ng-if with angularJS expression or is there any other way to achieve this?? I want to show that div if my loggedOnUser is equal to user.name

Thanks in advance

You need not explicitly give interpolate braces to loggedInUser. $compile does that for the ng-if directive — InfinitePrime
– InfinitePrime, Commented Sep 22, 2015 at 13:54

dice · Accepted Answer · 2016-06-20 09:39:23Z

8

It should be

ng-if="user.name == loggedOnUser"

instead of

ng-if="user.name == {{loggedOnUser}}"

You can user filters if you want to. But I suggest you to not trust on filters in your case. Please see below snippet, it will work in your above scenario.

<div ng-repeat="user in users | filter:name:loggedOnUser">

edited Jun 20, 2016 at 9:39

dice

2,8801 gold badge23 silver badges34 bronze badges

answered Sep 22, 2015 at 13:53

Vineet

4,7153 gold badges25 silver badges42 bronze badges

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

3 Comments

Vineet Over a year ago

@PratapA.K You can accept as an answer for further usage

Pratap A.K Over a year ago

Sure will do that!! I have one more doubt, What if $scope of loggedOnUser and users array are different???

Vineet Over a year ago

You must be using service or factory in this case you can reference the literals to that factory or service.

Gaurav Gupta · Accepted Answer · 2015-09-22 14:39:16Z

3

The condition for ng-if is an angular expression itself.

<ANY
    ng-if="expression">
    ...
</ANY>

therefore something like:

ng-if="someVal"

will match for $scope.someVal and not against the string "someVal"
so in your case it should be:

ng-if="user.name == loggedOnUser"

answered Sep 22, 2015 at 14:39

Gaurav Gupta

1,9255 gold badges22 silver badges40 bronze badges

Collectives™ on Stack Overflow

AngularJS ng-if with angular expression

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related