title: Passing data between angular controllers using service
body: <p>I am having trouble passing data between controllers using a service. What i want to happen is when send data is clicked the data inputted into the text field should be populated in the Results controller. However nothing shows</p>
  
  <p>Home.html:</p>
  
  <pre><code>   &lt;html&gt;
  &lt;body&gt;
  &lt;ion-header-bar class="bar-dark"&gt;
      &lt;h1 class="title"&gt;&lt;/h1&gt;
  &lt;/ion-header-bar&gt;
  &lt;ion-view view-title="Home"&gt;
      &lt;ion-content ng-controller="StockUpdateCtrl"&gt;
  
      &lt;div class="list"&gt;         
  &lt;ion-refresher pulling-text="Pull to Refresh" on-refresh="doRefresh()"&gt;&lt;/ion-refresher&gt;
      &lt;div&gt;{{text}}&lt;/div&gt;
      &lt;input type='text' ng-model='text' /&gt;
  
       &lt;button type='button' ng-click='send()'&gt;Send Data&lt;/button&gt;
       &lt;div ng-controller='ResultsController'&gt;
    &lt;div&gt;
      &lt;h4&gt;Ctrl2&lt;/h4&gt;
      &lt;div&gt;{{text}}&lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
      &lt;/ion-content&gt;
  
  &lt;/ion-view&gt;
      &lt;/body&gt;
      &lt;/html&gt;
  </code></pre>
  
  <p>HomeController.js:</p>
  
  <pre><code>var app = angular.module('starter', ['ionic'])
  
  
          .run(function ($ionicPlatform) {
              $ionicPlatform.ready(function () {
                  // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
                  // for form inputs)
                  if (window.cordova &amp;&amp; window.cordova.plugins.Keyboard) {
                      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
                  }
                  if (window.StatusBar) {
                      StatusBar.styleDefault();
                  }
              });
          })
  
  
  /*
   * Data Service 
   * Service used to pass data between controllers
   */
  app.factory('dataShare', function(){
     var service = {};
    service.data = false;
    service.sendData = function(data){
        this.data = data;
        $rootScope.$broadcast('data_shared');
    };
    service.getData = function(){
      return this.data;
    };
    return service;
  });
  
  /* 
   * Stock Update Controller
   * Gets user input and then performs calculations to prepare to be displayed
   * 
   */
  app.controller("StockUpdateCtrl", function ($scope, $http, dataShare) {
  
  
      $scope.text = 'Hey';
           $scope.send = function(){
             dataShare.sendData($scope.text);
           };
  
  
  
  });
  </code></pre>
  
  <p>ResultsController.js:</p>
  
  <pre><code> * Resultse Controller
   * Displays the results
   * 
   */
  app.controller("ResultsController",function ($scope, dataShare) {
  
      $scope.text = '';
                  $scope.$on('data_shared',function(){
                              var text =  dataShare.getData();    
                $scope.text = text;
          });
  });
  </code></pre>