nikitha
nikitha

Reputation: 179

Angular js comparison

I have a condition that needs to be checked in my view: If any user in the user list has the same name as another user, I want to display their age.

Something like

<div ng-repeat="user in userList track by $index">
 <span class="fa fa-check" ng-if="user.isSelected"></span>{{user.firstName}} <small ng-if="true">{{'AGE' | translate}} {{user.age}}</small>
</div>

except I'm missing the correct conditional

Upvotes: 0

Views: 69

Answers (2)

Paul Boutes
Paul Boutes

Reputation: 3315

You can simulate a hashmap key/value, and check if your map already get the property name. Moreover, you can add a show property for each objects in your $scope.userList

Controller

(function(){

function Controller($scope) {

var map = {};

$scope.userList = [{
  name:'toto',
  age: 20,
  show: false
}, {
  name:'titi',
  age: 22,
  show: false
}, {
  name: 'toto',
  age: 22,
  show: false
}];

$scope.userList.forEach(function(elm, index){
  //if the key elm.name exist in my map
  if (map.hasOwnProperty(elm.name)){
    //Push the curent index of the userList array at the key elm.name of my map
    map[elm.name].push(index);
    //For all index at the key elm.name
    map[elm.name].forEach(function(value){
      //Access to object into userList array with the index
      //And set property show to true
      $scope.userList[value].show = true;
    });
  } else {
    //create a key elm.name with an array of index as value
    map[elm.name] = [index];
  }
});


}

angular
.module('app', [])
.controller('ctrl', Controller);

})();

HTML

  <body ng-app="app" ng-controller="ctrl">

    <div ng-repeat="user in userList track by $index">
     <span class="fa fa-check"></span>{{user.name}} <small ng-if="user.show">{{'AGE'}} {{user.age}}</small>
    </div>


  </body>

Upvotes: 0

Adam Zerner
Adam Zerner

Reputation: 19178

You should probably run some code in your controller that adds a flag to the user object to indicate whether or not he/she has a name that is shared by another user.

You want to minimize the amount of logic there is inside of an ng-repeat because that logic will run for every item in the ng-repeat each $digest.

I would do something like this:

controller

var currUser, tempUser;
for (var i = 0; i < $scope.userList.length; i++) {
  currUser = $scope.userList[i];
  for (var j = 0; j < $scope.userList.length; j++) {
    if (i === j) continue;
    var tempUser = $scope.userList[j];
    if (currUser.firstName === tempUser.firstName) {
      currUser.showAge = true;
    }
  }
}

html

ng-if='user.showAge'

Edit: actually, you probably won't want to do this in the controller. If you do, it'll run every time your controller loads. You only need this to happen once. To know where this should happen, I'd have to see more code, but I'd think that it should happen when a user is added.

Upvotes: 1

Related Questions