HonningKake
HonningKake

Reputation: 61

List only one property of object array

I want an Angular list showing all the instances of one object property from an array of objects, and nothing more – for example, only the countries.

$scope.testSites = [
                { "site": "Testsite1", "country": "Country1", "customer": "Customer1"},
                { "site": "Testsite2", "country": "Country2", "customer": "Customer2"}
            ];
$scope.chosenCategory = 1;
$scope.categoryNames = ["site", "country", "customer"];
$scope.aspect = $scope.categoryNames[$scope.chosenCategory];

However, I want to use the above variable 'aspect' for choosing which property to show in the list. Something like {{x.country}}, though it works, is therefore not sufficient. I've tried this, but it returns an empty list:

<table border="1" class="list-group-item list-group-item-success">
            <tr>
                <th>{{aspect | capitalize}}</th> 
            </tr>

            <tr ng-repeat="x in testSites | orderBy:myOrderBy">
                <td>
                    {{x.aspect}}
                </td>

            </tr>
        </table>

Is there something I can do?

Upvotes: 4

Views: 104

Answers (1)

Suren Srapyan
Suren Srapyan

Reputation: 68635

You can do via {{ x[aspect] }} - [] bracket notation. It evaluates the expressoin and uses the result to find the property.

You can find Demo here

Upvotes: 6

Related Questions