指令如何通过控制器进行通信？

Question

在本文档中：http://docs.angularjs.org/guide/directive表示指令可以通过控制器相互通信。

控制器 - 控制器构造函数。控制器在预链接阶段之前被实例化，并且如果它们按名称请求它，则与其他指令共享（请参阅require属性）。 这允许指令相互沟通并增强彼此的行为。

我不明白，他们如何与控制器沟通？有没有任何示例或演示？

Answer 1

也许你在使用指令控制器发生路由更改时创建的控制器混淆。该部分只是讨论指令控制器，因此该部分的含义是，如果您在同一个HTML元素上有两个指令，则它们可以通过要求其他每个控制器进行通信。

一个很好的例子就是如果你创建了一个需要与ng-model沟通的指令。由于ng-model公开了一个控制器，你可以要求它像这样：

myApp.directive('myDirective', function() { 
    return { 
     require: 'ngModel', 
     link: function($scope, elem, attrs, ngModelCtrl) { 
      // Here you can listen to different DOM events, and 
      // call ngModelCtrl when the model value needs to update 
     } 
    } 
}); 

和HTML：

<input type="text" ng-model="myModel" my-directive> 

你的指令可以在对象实现它，你的指令函数返回暴露出控制器，像这样的：

myApp.directive('myDirective1', function() { 
    return { 
     link: function($scope, elem, attrs) { 

     }, 
     controller: function() { 
      this.sayHello = function() { 
       alert("hello!"); 
      } 
     } 
    } 
}); 

myApp.directive('myDirective2', function() { 
    return { 
     require: 'myDirective1', 
     link: function($scope, elem, attrs, myDirective1Ctrl) { 
      myDirective1Ctrl.sayHello(); 
     } 
    } 
}); 

和HTML：

<input type="text" my-directive2 my-directive1> 

您也可以通过编写require: '^myParentDirective'，像这样需要从父指令一个指令控制器：

myApp.directive('myDirective1', function() { 
    return { 
     link: function($scope, elem, attrs) { 

     }, 
     controller: function() { 
      this.sayHello = function() { 
       alert("hello!"); 
      } 
     } 
    } 
}); 

myApp.directive('myDirective2', function() { 
    return { 
     require: '^myDirective1', 
     link: function($scope, elem, attrs, myDirective1Ctrl) { 
      myDirective1Ctrl.sayHello(); 
     } 
    } 
}); 

和HTML：

<div my-directive1> 
    <div my-directive2></div> 
</div>