Having trouble populating a combo box in AngularJS. Here is the controller code snippet:
var app = angular.module('app');
app.controller('roadmap', function($rootScope, $scope, $http, $q, leFactory) {
$rootScope.activityInfoList=[];
$rootScope.brand_strategy_list=[];
$rootScope.brand_strategy_csf=[];
$rootScope.brand_strategy_initiatives=[];
leFactory.getActivityPopupInfo().then(function(activityList) {
$rootScope.activityInfoList=angular.copy(activityList);
console.log($rootScope.activityInfoList);
$rootScope.brand_strategy_list=$rootScope.activityInfoList.listBrandStrategy;
console.log($rootScope.brand_strategy_list);
console.log('editActivityPopup service accepted-> ');
}, function(error) {
console.log('editActivityPopup service rejected-> ', error);
});
$rootScope.items = [{
id: 1,
label: 'aLabel',
subItem: { name: 'aSubItem' }
}, {
id: 2,
label: 'bLabel',
subItem: { name: 'bSubItem' }
}];
});
In my HTML file, I am trying to populate the $rootScope.brand_strategy_list as shown below.
<select ng-model="activityInfoList.brandStrategy" class="selectpicker" data-style="btn-inverse" style="display: none;" ng-options="item.strategyName as item.strategyName for item in brand_strategy_list">
<option> Select </option>
</select>
The $rootScope.brand_strategy_list is not getting populated. However, when I tried populating $rootScope.items, it worked fine. Upon checking with console.log($rootScope.brand_strategy_list), I can see the complete list logged.
Can't figure out where I might be going wrong. Any help in solving this issue would be greatly appreciated. Thanks in Advance.