title: How to share data between controllers in different modules
body: <p>I have downloaded <code>Angular UI Bootstrap Datepicker</code>, and I need to access to its controllers for their scopes. But I have absolutely no idea how to do it without editing the code in Datepicker, which I think isn't the way it should be done.</p>
  
  <p>So I have my own app/module, <code>myApp</code> and I have a controller <code>MyController</code>, in which I need access to <code>UibDatepickerController</code> and <code>UibDaypickerController</code>, which are in <code>ui.bootstrap.datepicker</code> app/module. And I don't want to change the code in <code>ui.bootstrap.datepicker</code> module.</p>
  
  <p>This is basically <a href="https://stackoverflow.com/questions/39003910/how-to-pass-variable-to-angular-ui-bootstrap-datepicker-custom-class">the same problem</a> I posted while ago  but I have figured it out a lot I think. (Spent like 50 hours in this one :D) </p>
  
  <p><a href="https://stackoverflow.com/questions/26594140/how-to-share-data-between-two-modules-in-angularjs">This solution</a> doesn't work because you can't inject controller like you can inject a service.</p>
  
  <p>Here is kind of my design:</p>
  
  <p>Controller:</p>
  
  <pre><code>function MyCtrl() {
  var vm = this;
  vm.dt = new Date();
  vm.options = {
    ...
  };
  vm.refresh = function() {
    //returns initialized value all the time (current date)
    console.log(vm.dt);
    $("#calendar").data("$uibDatepickerController").refreshView();
  }
  };
  angular.module('myApp')
     .controller('MyCtrl', MyCtrl);
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div ng-controller="CalendarCtrl as calCtrl"&gt;
    &lt;pre&gt;Selected date is: &lt;em&gt;{{calCtrl.dt | date:'fullDate' }}&lt;/em&gt;
    &lt;/pre&gt;
    &lt;div style="display:inline-block"&gt;
      &lt;div uib-datepicker="" id="calendar" ng-model="calCtrl.dt" datepicker-options="calCtrl.options"&gt;&lt;/div&gt;
    &lt;/div&gt;
    &lt;button ng-click="calCtrl.refresh()"&gt;Refresh&lt;/button&gt;
  &lt;/div&gt;
  </code></pre>