angularjs: using service to communicate between controllers

Question

I have a service that is injected in my controllers. The service defines a number of functions.

Now I would like to add a variable to that service that would hold the selectedItem in the application. I've done it this way:

angular.module('myservices', []).
factory('serviceA', function () {        

    var serviceA= {  
      selectedItem: selectedItem,      
      ... more functions here
    };
    return serviceA;

    var selectedItem;
    ... functions go here
});

In one of my controllers I set the selected item:

 serviceA.selectedItem = someItem;

and in another controller the view references the selected item like this:

<span>{{serviceA.selectedItem.value}}</span>

The span is never updated, even though the selectedItem is set correctly. What am I doing wrong ?

Answer 1

To access the service in your view, you need to assign it to the scope:

$scope.serviceA = serviceA;

http://jsfiddle.net/MzJsZ/