Proper way to set up angularjs factory with cached data - angularjs

Question

I'm just starting out with Angular.js and I'm trying to figure out how to set up a factory that will show cached data and replace it with data retrieved from a REST service once it is received.
To test this out, I'm just hard-coding the "cached" data. Once the data is received, I want the $scope.directory variable to be updated with the latest data received from the server. I can either get it
Here's my factory code:
app.factory('directoryFactory', function ($http) {
var factory = {};
factory.directory = [{name: "Test", ext: "123"},{name: 'Bob', ext: "234"}];
init();
function init() {
$http({
method: 'GET',
url: '{restapiURL}'
})
.success(function (data, status, headers, config) {
factory.directory=data;
})
.error(function (data, status, headers, config) {
console.log('directory fail');
});
}
}
My Controller has the following code:
$scope.directory = directoryFactory.directory;
In my view, I use ng-repeat to list out all the people and their extensions.
I'd like the view to be updated once the data is received. What's the correct way to watch for factory data changes?

Answer 1

Your $scope.directory is promise that contains 2 handlers on success and on failure. Since $http is asynchronous, you don't know when response should come but "promise" will notify you about in case if you use then()
Here is example of POST but its the same flow:
factory:
myModule.factory('ajax_post', ['$http', function(_http) {
var path = 'src/php/data.ajax.php';
return{
init: function(jsonData){
var _promise= _http.post(path,
jsonData
,{
headers: {
'SOAPActions': 'http://schemas.microsoft.com/sharepoint/soap/UpdateListItems'
}
}
);
return _promise;
}
}
}]);
In controller:
var _promise= ajax_post.init(jsonData);
_promise.then(function (result) {
//do something with your result
},
function (error) {
alert(error.message);
}
);