title: How to call a controller function from a service?
body: <p>i have 2 controllers who are not in the same scope or have a parent child relation.</p>
  
  <p>So i want to call from controlleB a function in ControllerA. In my case its a listContoller with an addItem function and i want to call this function from a addItemController somewhere else on the page after clicking submit. i know this should work with a service, but i dont know how.</p>
  
  <pre><code>app.controller("listCtrl", ["$scope", "listSvc", function ($scope, listSvc){
      $scope.list.data = listSvc.load("category");
      $scope.addItem = function(newitem) {
          $scope.list.data.unshift(newitem);
          ...
      }
  }]);
  
  app.controller("addItemCrtl", ["$scope", "listSvc", function ($scope, listSvc){
      $scope.addItem = function() {
          listSvc.addItem($scope.newItem);
      }
  }]);
  
  app.service('listSvc',  function() {
      return{
          load: function(section){
              ...
          },
          addItem: function(item){
              addItem(item); &lt;&lt;-- call function in listController
          }
      }
  });
  </code></pre>
  
  <p><strong>UPDATE</strong></p>
  
  <p>k is this better? i put the list.data inside my service and i watch from my controller if the list change and put it on the scope from my controller that ng-repeat can do his work... is this appraoch better? or have someone better tips for me how i should do this...</p>
  
  <pre><code>app.service('listSvc',  ['$http', function($http) {
      var list = {};
      return {    
          list:{
              get: function () {
                  return list.data;
              },
              set: function (data) {
                  list.data = data;
              }           
          },
          addItem: function(item){
              var response = $http.post("/api/album/"+$scope.list.section, item);
              response.success(function(){
                  list.data.unshift(item);
                  console.log("yeah success added item");
              }).error(function(){
                  console.log("buuuh something went wrong");
              });
              return response;
          },
  
          load: function(section){
              var response = $http.get("/api/album/"+section);
              response.success(function(data){
                  list.set(data);
                  list.section = section;
                  console.log("yeah success loaded list");
              }).error(function(){
                  console.log("buuuh something went wrong");
              });
              return response;
          }
      };
  }]);
  </code></pre>
  
  <p>and in my controllers i do this</p>
  
  <pre><code>app.controller("listCrtl", ["$scope", "listSvc", function ($scope, listSvc){
      listSvc.load("category");
      ...
      $scope.$watch('listSvc.list.get()', function(data) {
          $scope.list.data = data;
      });
      ...
  }]);
  
  
  app.controller("addItemCrtl", ["$scope", "listSvc", function ($scope, listSvc){
      ...
      $scope.addItem = function() {
          listSvc.addItem($scope.newItem);
      }
      ...
  }]);
  </code></pre>
  
  <p>gregor ;)</p>