These are my scope variables
$scope.published = true;
$scope.count = 3;
I also have an array called labels
$scope.labels = ['published', 'count'];
In the view I want to view these data as the label name - label value.
<div ng-repeat="label in labels">
{{label}} - {{Here I want the value from the Scope variable}}
</div>
Can someone help me how to access the scope variable in this kind of scenario?
Use the this identifier and bracket notation property accessors:
<div ng-repeat="label in labels">
{{label}} - {{this[label]}}
</div>
From the Docs:
It is possible to access the context object using the identifier
thisand the locals object using the identifier$locals.
For more information, see
angular.module("app",[])
.controller("ctrl", function($scope) {
$scope.published = true;
$scope.count = 3;
$scope.labels = ['published', 'count'];
})<script src="//unpkg.com/angular/angular.js"></script>
<body ng-app="app" ng-controller="ctrl">
<div ng-repeat="label in labels">
{{label}} - {{this[label]}}
</div>
</body>Map your labels to {key:"labelKey", value:"valueInScope"} so you can use them in the template.
Something like this could work
labels = ['published','count']
.map(
function(label){
return {key:label,value:$scope[label]}
});
then use
<div ng-repeat="label in labels">
{{label.key}} - {{label.value}}
</div>
ng-controller, which is assigned to the same controller containing your$scopevariables, it should just be a matter of using{{count}}or{{published}}in your HTML if you want to display the values literally. If you've aliased your controller (e.g.ng-controller="Ctrl as foo") then you'll need to prefix the interpolations with the alias (e.g.{{foo.count}}).labelscollection to objects which index the$scopeproperties, or have a function which returns the latter and make use of it with yourng-repeat(e.g.ng-repeat="obj in getObjs()"). If thelabelscollection ever varies, then the latter approach ensures you don't need to explicitly remap the labels.