Communicate between two same directive having isolated scope

Question

I am novice to angularjs and i have a custom directive which has an isolated scope. I am having problem communicating between two instance of same directive . How can i do that ? Your suggestion is highly appreciated .

<div date-control="cal1" ng-model="mydate" calendar-properties="calendarProperties1"></div>
<div date-control="cal2" ng-model="mydate2" calendar-properties="calendarProperties2"></div>

What i want to do is open both date-control at once having 'to' and 'from' attribute in calendar properties using some data sharing or any thing ? you can check this plnkr sample.

Answer 1

directives are just the result of a function call

angular.directive('myDir',function(){
  var common;
  return directiveObject;
});

directiveObject being the any of the variantes you use to create your directive.The main thing is that right before returning you can declare common(class if you will) variables and methods that can be checked for changes or invoked so you could do something like

app.directive('myDir',function(){
  var bus={
    value1:0
  };

  function increase(){
    bus.value1++;
  }

  return {
     scope:{},
     template:"<div><h1>{{counter}}</h1><button ng-click="increase()">add</button></div>"
     controller:function($scope){
       $scope.bus=bus;
       $scope.increase = increase
       $scope.$watch('bus',function(){
         //something here
       })
     }
  };
});

a sample of this can be found here. this can be shaped in many ways http://plnkr.co/edit/d9dpIYCAjOaOBNjoI80u?p=preview

some other methods can be used like emitting and broadcasting events or even using services, but i like the simplicity of this method.