Question

我正在尝试链接两个使用隔离范围的嵌套指令。

<div ng-controller="myController">
    <my-dir on-done="done()">
        <my-dir2 on-done="done()">
        </my-dir2>
    </my-dir>  
</div>

我希望第二个指令（my-dir2）调用第一个指令（my-dir）的done（）函数，然后调用控制器一个。

不幸的是我不知道如何使第二个指令访问第一个指令的回调（到目前为止，第二个指令正在查看高级控制器，绕过第一个指令）。

我认为可以使用“require”，但我不能，因为这两个指令没有关系（我想在其他指令中使用my-dir2而不仅仅是my-dir）。

说清楚：我不想使用require，因为这意味着myDir会依赖于myDir2。我的观点是：我希望能够在其他指令中重用myDir2。所以我不希望myDir2基于myDir，但我确实想要在完成某些事情时通知上层指令（myDir）（比如在js中的回调中）。

我已经制作了一个plunker：正如您在javascript控制台中看到的那样，my-dir2直接从高级控制器调用done函数。

有没有人有干净的方法来应对这种情况？

由于

Answer 1

<强>更新

能够编写彼此独立的指令，您需要使用事件：

使用$emit('myEvent', 'myData')触发将由层次结构中向上的范围处理的事件。
使用$broadcast('myEvent', 'myData')触发将由层次结构中向下的范围处理的事件。
处理$emit或$broadcast使用$on('myEvent', function(event, data){\\your code})

PS：在你的情况下，$emit将不起作用，因为两个指令范围在层次结构中处于同一级别，因此您需要使用$rootScope.$broadcast('myEvent' \*, myData*\);我已更新我的plunker以反映需要更改http://plnkr.co/edit/eTkO6sk6hpuYPnCjlSKn?p=info

以下内容将使内部指令依赖于外部指令：

基本上能够在第一个指令中调用一个你需要做一些改变的函数：

将require = '^myDir'添加到myDir2
从onDone移除myDir2并保留隔离范围 scope:{}
将控制器参数添加到myDir2 link: function(scope,element,attrs,controller)

myDir1

done

$scope.done

this.done

在controller.done()

myDir2

这是一个需要更改http://plnkr.co/edit/eTkO6sk6hpuYPnCjlSKn

Answer 2

我认为你可以这样做： angular.element（＆＃39;我的-DIR＆＃39;）控制器。（＆＃39; MYDIR＆＃39）。（）完成;

试一试！

如何链接在angularjs中使用隔离范围的嵌套指令

2 个答案: