当嵌套/嵌入指令被编译和链接时做一些事情答案

【问题标题】：Do something when nested/transcluded directives have been compiled and linked当嵌套/嵌入指令被编译和链接时做一些事情
【发布时间】：2016-05-20 10:55:48
【问题描述】：

想想类似下面的指令标记：

<!-- Directive A -->
<directive-a>
</directive-a>

<-- Directive B -->
<directive-b>
   <directive-a>
        <transclusion1></transclusion1>
   </directive-a>
</directive-b>

一旦<directive-a> 已经从<directive-b> 编译+链接，我需要执行一些DOM 操作。

当我在<directive-b>（或compile 函数）上提供link 函数时，<directive-a> 仍然没有被嵌入的内容。

一旦<directive-a> 已经编译+链接，我不知道如何执行该 DOM 操作。

【问题讨论】：

MCVE 会有所帮助。
@estus 不在这种情况下......我即将找到解决方案，因为 Angular 1.5.3+ 有钩子。我怀疑 MCVE 在这里会有所帮助，因为我的问题不是错误、错误或其他什么：它是一个概念，我需要知道如何在 Angular 中实现它。
在link 函数和$postLink 钩子中已经可以使用被嵌入的元素。如你所愿。
@estus 如果这是真的......我不会在这里问问题：D
如果不花一些时间发布自己的指令，您将很难得到另一个答案。

标签： javascript angularjs angularjs-directive angularjs-ng-transclude

【解决方案1】：

最终解决方案比我开始实施解决方案时的想象要容易。

假设<directive-a> 具有以下选项：

{
    scope: {
        "postLink": "&"
    }
}

...并且，作为controller() 功能的一部分，我这样做：

{
    controller: () => {
        // Angular 1.5.3+
        this.$postLink = $scope.postLink;
    },
    scope: {
        "postLink": "&"
    }
}

现在我可以挂钩<directive-a> $postLink 挂钩：

<-- Directive B -->
<directive-b>
   <directive-a post-link="model.directiveAPostLink()">
        <transclusion1></transclusion1>
   </directive-a>
</directive-b>

当整个model.directiveAPostLink()函数被调用时，<directive-a>已经被编译和链接了！

更多详情