Joe82
Joe82

Reputation: 1251

AngularJS - ng-if checking for true values when key is unknown

I want to apply a ng-if in AngularJS depending if any of the values in a JSON is true. The first level keys are always the same, but then the second level keys are always different. (so I cannot do ng-if="known_stuff.unpredictable_thing", as the name of "unpredictable_thing" will be different each time. Here is the JSON.

{
    "known_stuff":
        {
            "unpredictable_thing":false
        },
    "known_stuff_2":
        {
            "non_predictable_stuff":true
        },
    "known_stuff_3":
        {
            "something_unknown":false
        }
} 

Thanks in advance!

Upvotes: 0

Views: 2047

Answers (3)

Dimitri Lavrenük
Dimitri Lavrenük

Reputation: 4879

controller:

$scope.check = function(someObject) {
    // return true if some value is true inside the object
    for (var key in someObject) {
        if (someObject[key] === true) {
            return true;
        }
    }
    return false;
};

template:

ng-if="check(known_stuff)"

or

ng-show="check(known_stuff)"

if your data is an array then the function has to look like that:

$scope.checkData = function(data) {
    for (var i = 0; i < data.length; i++) {
        for (var key1 in data[i]) {
            // return true if some value is true inside the object
            for (var key in data[i][key1]) {
                if (data[i][key1][key] === true) {
                    return true;
                }
            }
        }
    }
    return false;
};

template:

ng-if="checkData(data)"

Upvotes: 1

Zest
Zest

Reputation: 693

If I got your question right, your json will have the first level key same (known_stuff) but inside know_stuff there can be multiple key with different names (like unpredictable_thing here).

The easiest solution is to iterate the first level key, gaining key value pair like below.

<div ng-repeat = "(key, val) in known_stuff" ng-if="known_stuff[key]">
    //do something --> {{key}} - {{val}}
</div>

Supporting Plunk -> http://plnkr.co/edit/6hQQAtqRseb1gWvueFKr

-----------------------------------------------UPDATE---------------------------------------------

Assign jsonData with your data.

<div ng-repeat= "stuff in jsonData">
  <div ng-repeat = "(key, val) in stuff" ng-if="stuff[key]">
      //do something --> {{key}} - {{val}}
  </div>
</div>

Also, updated the same plunk. I hope this answers your question.

Upvotes: 0

Ali Adravi
Ali Adravi

Reputation: 22763

If you want to check any of the value in your provided json is true then

ng-if="known_stuff.unpredictable_thing == ture || 
        known_stuff_2.non_predictable_stuff == true ||
        known_stuff_3.something_unknown == true"

Upvotes: 1

Related Questions