编辑：

Question

如何正确地将控制器分配给指令，以便2个指令可以相互通信。当我将第二个指令的require参数设置为第一个指令的名称时，我在控制台中收到错误：

错误：没有控制器：dir       在错误（）       at getControllers（http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:4132:19）       at nodeLinkFn（http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:4259:35）       在compositeLinkFn（http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:3869:15）       在compositeLinkFn（http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:3872:13）       at nodeLinkFn（http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:4252:24）       在compositeLinkFn（http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:3869:15）       在compositeLinkFn（http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:3872:13）       在publicLinkFn（http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:3775:30）       在http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:934:25 <div class="btn btn-danger" dir2=""> angular.js：5601

（匿名函数）angular.js：5601

（匿名函数）angular.js：4698

nodeLinkFnangular.js：4261

compositeLinkFnangular.js：3869

compositeLinkFnangular.js：3872

nodeLinkFnangular.js：4252

compositeLinkFnangular.js：3869

compositeLinkFnangular.js：3872

publicLinkFnangular.js：3775

（匿名函数）angular.js：934

范围$ evalangular.js：7905

范围$ applyangular.js：7985

（匿名函数）angular.js：932

invokeangular.js：2813

bootstrapangular.js：930

angularInitangular.js：906

（匿名函数）angular.js：14600

cjquery-latest.min.js：3

p.fireWithjquery-latest.min.js：3

b.extend.readyjquery-latest.min.js：3

ħ

以下是plnkr中的示例。

编辑：

我正在尝试做很多网站中出现的事情，通过点击按钮或链接从列表视图到缩略图视图等来更改视图模板... 我想为按钮切换器制作一个名为“切换器”的2个指令，另一个为视图调用“可切换视图”。这是一个带有示例代码的plnkr。我的想法是，当我点击“切换器”指令时，它在可切换指令中切换模板，这将导致切换视图，我希望这很清楚。我想做的是这样的plnkr

提前致谢。

Answer 1

实际上，当您想要在指令之间共享控制器时，您需要在一个元素上或在层次结构的上方某处（并在名称之前添加'^'）。

所以你的问题的答案是：这个错误产生了，因为必需的指令/控制器不在DOM元素的相同或更高层次上。

我想，您希望有一些容器来存储attributes的列表，然后从指令中操作此列表。我的建议是有另一个存储它们的指令（如ngForm do）。因此，位于DOM层次结构的不同叶子上的指令（dir，dir2）都需要一些包含共享数据的指令，并且具有共同的层次结构。种类：

──── attributesDirective (in controller: this.doSomething())
                     ├ dir1 (requre: '^AttributesDirective')
                     └ dir2 (requre: '^AttributesDirective')

但实际上，您可以在不添加任何指令和任何JS代码的情况下实现您在“编辑”中所描述的内容：添加属性template将存储模板文件的名称，并在用户单击项目时更改此属性。 ngInclude将获取新值并重新加载模板。

以下是您使用此解决方案更改的plunker：http://plnkr.co/edit/z7wg1TCIdmQjfT8A2rZe?p=preview

在AngularJS中的指令中分配和使用控制器的正确方法

编辑：

1 个答案: