blocks|key|3034296|text|也许您混淆了路由更改时创建的控制器和指令控制器。这一节只讨论指令控制器，所以这一节的意思是，如果你在同一个HTML元素上有两个指令，它们可以通过要求彼此的控制器进行通信。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3034297|一个很好的例子是，如果您创建了一个需要与ng-model通信的指令。由于ng-model公开了一个控制器，因此您可以像这样要求它：|offset|length|style|CODE|3034298|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
++++++++}
++++}
});|code-block|syntax|javascript|3034299|和HTML：|3034300|<input+type="text"+ng-model="myModel"+my-directive>|3034301|您的指令可以通过在指令函数返回的对象中实现它来公开控制器，如下所示：|3034302|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();
++++++++}
++++}
});|3034303|3034304|<input+type="text"+my-directive2+my-directive1>|3034305|您还可以通过编写require:+'%5EmyParentDirective'从父指令中请求一个指令控制器，如下所示：|3034306|myApp.directive('myDirective1',+function()+{
++++return+{
++++++++link:+function($scope,+elem,+attrs)+{

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

myApp.directive('myDirective2',+function()+{
++++return+{
++++++++require:+'%5EmyDirective1',
++++++++link:+function($scope,+elem,+attrs,+myDirective1Ctrl)+{
++++++++++++myDirective1Ctrl.sayHello();
++++++++}
++++}
});|3034307|3034308|<div+my-directive1>
++++<div+my-directive2></div>
</div>|3034309|entityMap^0|0|K|8|10|8|0|0|0|0|0|0|0|0|8|T|0|0|0|0^^$0|@$1|2|3|4|5|6|7|16|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|17|8|@$D|18|E|19|F|G]|$D|1A|E|1B|F|G]]|9|@]|A|$]]|$1|H|3|I|5|J|7|1C|8|@]|9|@]|A|$K|L]]|$1|M|3|N|5|6|7|1D|8|@]|9|@]|A|$]]|$1|O|3|P|5|J|7|1E|8|@]|9|@]|A|$K|L]]|$1|Q|3|R|5|6|7|1F|8|@]|9|@]|A|$]]|$1|S|3|T|5|J|7|1G|8|@]|9|@]|A|$K|L]]|$1|U|3|N|5|6|7|1H|8|@]|9|@]|A|$]]|$1|V|3|W|5|J|7|1I|8|@]|9|@]|A|$K|L]]|$1|X|3|Y|5|6|7|1J|8|@$D|1K|E|1L|F|G]]|9|@]|A|$]]|$1|Z|3|10|5|J|7|1M|8|@]|9|@]|A|$K|L]]|$1|11|3|N|5|6|7|1N|8|@]|9|@]|A|$]]|$1|12|3|13|5|J|7|1O|8|@]|9|@]|A|$K|L]]|$1|14|3|-4|5|6|7|1P|8|@]|9|@]|A|$]]]|15|$]]

<p>Perhaps you're confusing a controller that is created when a route change occur with a directive controller. That section is only talking about directive controllers, so what that section means is that if you have two directives on the same HTML element, they can communicate by requiring each others controllers.</p>

<p>A good example of that is if your creating a directive that needs to communicate with <code>ng-model</code>. Since <code>ng-model</code> exposes a controller, you can require it like this:</p>

<pre><code>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
        }
    }
});
</code></pre>

<p>And the HTML:</p>

<pre><code>&lt;input type="text" ng-model="myModel" my-directive&gt;
</code></pre>

<p>Your directive can expose a controller by implementing it in the object that your directive function returns, like this:</p>

<pre><code>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();
        }
    }
});
</code></pre>

<p>And the HTML:</p>

<pre><code>&lt;input type="text" my-directive2 my-directive1&gt;
</code></pre>

<p>You can also require a directive controller from a parent directive by writing <code>require: '^myParentDirective'</code>, like this:</p>

<pre><code>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();
        }
    }
});
</code></pre>

<p>And the HTML:</p>

<pre><code>&lt;div my-directive1&gt;
    &lt;div my-directive2&gt;&lt;/div&gt;
&lt;/div&gt;
</code></pre>


<p>In this document: <a href="http://docs.angularjs.org/guide/directive" rel="noreferrer">http://docs.angularjs.org/guide/directive</a>, it says directives may communicate with each other by controllers.</p>

<blockquote>
  <p><strong>controller</strong> - Controller constructor function. The controller is instantiated before the pre-linking phase and it is shared with other directives if they request it by name (see require attribute). <strong>This allows the directives to communicate with each other and augment each other's behavior.</strong></p>
</blockquote>

<p>I don't understand it well, how they communicated with controllers? Is there any example or demo for it? </p>


How do directives communicate by a controller?

路由

在这篇文档：中，它说指令可以通过控制器相互通信。 控制器-控制器构造函数。控制器是在预链接阶段之前实例化的，如果其他指令按名称请求它，它将与其他指令共享(请参见require属性)。这允许指令相互通信并增强彼此的行为。我不太明白，他们是怎么和控制员沟通的？有没有它的例子或演示？

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

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

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

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

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