Dynamic Attribute Reference Inside Angular Ng-repeat

I build a dropdown directive, and it work with a different objects types, each object has own particular atributes, i need to get some particular field inside a ng-repat of my drop

Solution 1:

Yes it is possible to change the property attribute dynamically in ng-repeat.Below is a sample example code on how to achieve this.

1) You should have data source like below to make things easy

$scope.objectsList = [{
                'name': 'Vikram',
                'Age': '25',
                'sex': 'M'
            }, {
                'name': 'Quantum',
                'Age': '26',
                'sex': 'F'
            }, {
                'name': 'Katty',
                'Age': '22',
                'sex': 'F'
            }];
            $scope.objName = 'name';

2) In your HTML have something like this in your ng-repeat

<png-repeat="obj in objectsList">
    {{obj[objName]}} <!-- here by changing the 'objName' we can decide which property value to be displayed dynamically--></p><inputtype="text"ng-model="objName"/><!-- This is for example..u dont need this-->

If you look at JS we have mentioned $scope.objName = 'name'; i.e it will display all the names in a list,if we change the $scope.objName to 'Age' then it will display corresponding ages in the data source.

Hope this is answers your question.

Solution 2:

If you want to show cityName or peopleName conditionally in td,

you can use like this.

It's not building DOM conditionally but you can see like that. Wheather it is not a good way on you, but I hope it to help you.

<divclass="listCombo"ng-show="showDrop"ng-mouseleave="lostFocus()"><table><trng-repeat="result in results"ng-click="selectItem(result)"><tdng-show="someCondition(result) === true"> {{result.cityName}} </td><tdng-show="someCondition(result) === false"> {{result.cityName}} </td></tr></table></div>