Angular Service: Data not being retrieved after storage - angularjs

Question

I'm learning angular, and I'm trying to use a service to store data from an HTTP request, and be able to access it later.
Problem:
Data object is empty every time I try to retrieve it, which causes it to make a new call. I'm using this in the context of a ui-router resolve(does this cause the service to re-instantiate and lose the data)?
Service:
evaApp.factory('userService', ['$http', '$q', function ($http, $q) {
var user = {};
return {
makeRequest : function(url, uid) {
var deferred = $q.defer();
if (!uid) { uid = ''; };
$http.get(url, { params : { userId : uid } }).then(function (res) {
deferred.resolve(res.data);
});
return deferred.promise;
},
getUser : function(userId) {
console.log(user); // user is always empty
if(!user || !user._id) {
user = this.makeRequest('/api/user/get', userId);
};
return user;
}
}
}]);
Addition:
Data storage is working using PSL's solution. Data retrieval is not: Link to question.

Answer 1

this.makeRequest returns a promise and it does not have a _.id property which is causing it to make the ajax call again (due the condition if(!user || !user._id) {). just return the promise itself from getUser and use it. Remember you are not assigning the user instead assigning a promise by doing user = this.makeRequest('/api/user/get', userId);
Instead just do:-
var user = {};
getUser : function(userId) {
return user[userId] || (user[userId] = this.makeRequest('/api/user/get', userId)
.catch(function(){ user = null })); //nullify in case of error for retry
}
and in make request just do:
makeRequest : function(url, uid) {
if (!uid) { uid = ''; };
return $http.get(url, { params : { userId : uid } }).then(function (res) {
return res.data;
});
},
and while making call from controller you would do:-
mySvc.getUser(userId).then(function(user){
myCtrlInstance.user = user;
});
Note: Avoid using deferred anti-pattern when you already have an operation that returns a promise.

Answer 2

You can make something like this:
evaApp.factory('userService', ['$http', '$q', function ($http, $q) {
var user = {};
return {
makeRequest : function(url, uid) {
var deferred = $q.defer();
if (!uid) { uid = ''; };
$http.get(url, { params : { userId : uid } }).then(function (res) {
user = res.data;
deferred.resolve(user);
});
return deferred.promise;
},
getUser : function(userId) {
console.log(user); // user is always empty
if(!user || !user._id) {
return this.makeRequest('/api/user/get', userId);
};
var deferred = $q.defer();
deferred.resolve(user);
return deferred.promise;
}
}
}]);
And then get the user details like this (the 1 is just for the example):
userService.getUser(1).then(
function( data ) {
console.log(data);
}
);