Try this approach:
HTML
<div ng-controller="fessCntrl">
<select ng-model="selectedItem" ng-options="selectedItem.name as selectedItem.name for selectedItem in values"></select>selectedItem: {{selectedItem}}
</div>
JS
var fessmodule = angular.module('myModule', ['ngResource']);
fessmodule.controller('fessCntrl', function ($scope, Data, $timeout) {
Data.loadData().then(function (result) {
$timeout(function () {
$scope.values = result;
$scope.selectedItem = $scope.values[0].name;
}, 2000); // dummy, to simulate delay
},
function (result) {
alert("Error: No data returned");
});
});
fessmodule.$inject = ['$scope', 'Data', '$timeout'];
fessmodule.service('Data', ['$resource', '$q', function ($resource, $q) {
this.values = [{
"id": 1,
"name": "General"
}, {
"id": 2,
"name": "Super"
}, {
"id": 3,
"name": "Trial"
}];
this.loadData = function() {
this.deferred = $q.defer();
this.deferred.resolve(this.values);
return this.deferred.promise;
};
}]);
Demo Fiddle
Sounds like you have problem AccountService
. Above code with service is work
However if I'll write service by this way:
fessmodule.service('Data', ['$resource', '$q', function ($resource, $q) {
this.values = [{
"id": 1,
"name": "General"
}, {
"id": 2,
"name": "Super"
}, {
"id": 3,
"name": "Trial"
}];
this.factory = {
loadData: function (selectedSubject) {
this.deferred = $q.defer();
this.deferred.resolve(this.values);
return this.deferred.promise;
}
}
return this.factory;
}]);
I get error: TypeError: Cannot read property '0' of undefined
Fiddle