在多层嵌套指令之间进行通信

这有点复杂，请耐心等待。我有指令的三个层次：在多层嵌套指令之间进行通信

顶层 - 一个弹出指令
中间层 - 一个switch-pane指令*
底层 - 的几个视图之一

顶层只是一些弹出窗口，代表我的应用程序中的向导。中间层是我制作的一个指令，充当一堆视图 - 您可以“推”和“弹出”视图。显示“顶部”视图，其余部分被推到一边并模糊。底层是一组通常不相关的视图，它们根据用户的操作动态加载并显示在switch-pane中。

到目前为止，这工作，但：目前，顶层的$scope有代表所有switch-pane应显示的意见，传递给switch-pane指令作为一个属性数组属性和switch-pane指令$watch ES IT和更新本身。这是好的，但我认为它不够好 - 我想switch-pane指令本身来管理它的视图堆栈，并且只公开push和pop API。

下面是我想到的几种方法：

使用$broadcast/$emit - 顶层将$播出的“推”事件和switch-pane会抓住它，并尽一切可能需要
使用一种服务（用于订阅并激发“推送”事件 - 就像使用$broadcast一样，但不会在整个范围树中传播
使用允许switch-pane指令注册其自己的API的服务。识别它如attribu TE甚至元素ID
使用angular.element().scope()获得访问switch-pane的内部运作

坦率地说，我不喜欢任何的这些方法很多。当然，我想避免绑定到DOM，所以最后2个是最差的。

任何其他方式来做到这一点？考虑到除了通过DOM之外，我们没有真正访问某个指令的某个实例，哪个是暴露指令API的最方便的方式？

来源

2013-09-29 motig88

也许值得添加注释：'emit'方法和类似的“全局事件”解决方案的问题是 - 识别事件的来源。如果我有2个这样的switch-pane指令，我如何将我的“push”事件指向特定的一个，而不将自己绑定到当前的DOM结构？（即不使用指令的元素ID） – motig88

你可以检查如何实现ng-form，ng-model和ng-input。基本上如果表单有一个名称，例如<form name="foo" ...>其控制器发布到当前范围，在这种情况下$scope.foo变量。一旦控制器发布，您可以在ng-form指令之外使用其API。

如果指定require: "^ngForm"选项，您也可以从其他指令访问此控制器。

这是一个从我的项目中取得的例子。这是用jQuery编写的jqGrid网格插件的一种包装：https://github.com/9ci/angle-grinder/blob/06856b0d940b572960025f06f470c2f40fdc0ceb/app/scripts/modules/gridz.coffee#L12

来源

2013-09-29 11:43:03 luacassus

'require'解决方案，如Angular的主页示例和答案中所示，与我的情况相反 - 您可以使用require：^ parentController来访问父级的“API”的种类，但我需要的是父级（顶级）访问一个包含在**它内的**指令的API。 – motig88

在多层嵌套指令之间进行通信

回答

相关问题