<ul>
<li 
ng-repeat="category in categoryList">
{{category.Name}} <br>
<ul>
<li 
ng-repeat="game in gameList" ng-if="game.{{category.Name}}">
{{game.Name}}
</li>
</ul>
</li>
</ul>

<ul>
<li 
ng-repeat="category in categoryList">
{{category.Name}} <br>
<ul>
<li 
ng-repeat="game in gameList" ng-if="game.{{category.Name}}">
{{game.Name}}
</li>
</ul>
</li>
</ul>

I want to check if a certain game has a child with a name of the category, with the brackets it would just look up a specific child called category which doesn't exist.

• javascript
• angularjs
• dom
• angularfire

Share Improve this question Follow edited Jan 1, 2017 at 7:17 jophab 5,5271414 gold badges4444 silver badges6161 bronze badges asked Dec 17, 2014 at 13:43 DorgalamDorgalam 3511 silver badge66 bronze badges 5

• try to change it to ng-if="game[{{category.Name}}]" – Rasalom Commented Dec 17, 2014 at 13:45
• 1 methinks better ng-if="game[category.Name]" – Grundy Commented Dec 17, 2014 at 13:48
• @user4370437 so which ment is work? :-) – Grundy Commented Dec 17, 2014 at 13:53
• I think yours, or both :D – Rasalom Commented Dec 17, 2014 at 13:54
• 1 @Rasalom small fiddle :-D – Grundy Commented Dec 17, 2014 at 14:05

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 5

in ng-if directive you can reference to variable category directly

ng-if="game[category.Name]"

angular.module('app',[])
.controller('ctrl',function($scope){
    $scope.categoryList = [
        {Name : '1'},
        {Name : '2'},
        {Name : '3'},
        {Name : '4'},
        {Name : '5'}
    ];
    
    $scope.gameList = [
        {Name : 'g1', '1':true},
         {Name : 'g2', '1':true},
         {Name : 'g3', '2':true},
         {Name : 'g4', '7':true}
    ]
    
});

<script src="https://ajax.googleapis./ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="app" ng-controller="ctrl">
  <ul>
    <li ng-repeat="category in categoryList">
      Category - {{category.Name}} <br>
      <ul>
        <li ng-repeat="game in gameList" ng-if="game[category.Name]">
          Game - {{game.Name}}
        </li>
      </ul>
    </li>
  </ul>
</div>

You may have to do that from a function in your controller. $scope.nameExists = function (game, name){return typeof game[name] !== 'undefined'; }; then ng-if="nameExists (game, category.Name)"