I have the following factory I use to return a http promise with the user data from the server
(function () {
angular.module('BlurAdmin.theme')
.factory('getData', function($http){
var service = {};
service.objData = null;
service.savePromise = function(objData) {
service.objData = objData;
}
service.getSavedPromise = function() {
return service.objData;
}
service.getDataFromServer = function() {
var promise = $http.get('/admin/data');
service.savePromise(promise);
}
return service;
});
})();
I launch this http request at the run method of the app.
In another controller I have done the following
getData.getSavedPromise().then(function (data) {
$scope.newVisits = data.data.data.newVisitors;
});
var pieColor = baUtil.hexToRGB(baConfig.colors.defaultText, 0.2);
$scope.charts = [{
color: pieColor,
description: 'New Visits',
stats: '$ ' + $scope.newVisits,
icon: 'person',
}, {
color: pieColor,
description: 'Purchases',
stats: '$ 89,745',
icon: 'money',
}, {
color: pieColor,
description: 'Active Users',
stats: '178,391',
icon: 'face',
}, {
color: pieColor,
description: 'Returned',
stats: '32,592',
icon: 'refresh',
}
];
The Data structure is a little messed up and I need to fix it but that is beside the point.
I use for example
<div class="description-stats">{{ ::chart.stats }}</div>
In the html.
The issue is that the data is not being bind and I see undefined in the page.
What am I doing wrong?