AngularJS - update data using services factory with $resource from another controller

Question

I meet a problem with $resource of angularjs

I have a service factory :

angular.module('publicApp').factory('Model', function ($resource) {
   var totalStock = $resource('./resource/data/totalStock',{},{}});
   return {
     totalStock : totalStock 
          }
});

And a controller get data from service :

angular.module('publicApp')
 .controller('ManageCtrl', function ($scope, Model) {
  $scope.total = Model.totalStock.query();
 });

then, in another controller, when a function inside it success, I recall the services :

angular.module('publicApp')
 .controller('ActionCtrl', function ($scope, Model) {

   $scope.checkout = function () {
   $http.post('/resource/action/sold', formData).success(function (resp) {
    if (resp.resCode == -1) {
      alert(resp.result);
      return;
    }
    console.log('sold!');   
    Model.totalStock.query();
     });
   }
});

My idea that when Model.totalStock.query() service recall, the $scope.total value of ManageCtrl is updated also. Anyone suggest me do it in right way?

Answer 1

I am not sure, but this may work:

You can create two factories:

'ModelRessource' factory is only used by your 'Model' factory.

angular.module('publicApp').factory('ModelRessource', function ($resource) {

    var totalStock = $resource('./resource/data/totalStock',{},{}});
    return {
         totalStock : totalStock 
      }
});

Then, you use 'Model' factory to interact with your ressource. If you bind your $scope to Model.totalStack, every time refreshTotalStack() is call, totalStack should be updated.

angular.module('publicApp').factory('Model', function (ModelRessource) {

    var data = {};
    data.totalStack = {};

    return {

       totalStack : data.totalStack,

       refreshTotalStack : function () {
           ModelRessource.totalStock.query(function (resp) {
               data.totalStack = resp;
               return data.totalStack;
           });
       }
   }
});