让内部指令在外部指令 angularjs 之前运行 [英] Let inner directives run before outer directives angularjs

问题描述

我有以下 html:

<ul class="tabs"><li ng-repeat="tab in tabs">{{ tab }}</li><div class="tab_content"><div ng-repeat="tabContent in tabsContent">{{ tabContent }}</div>

我遇到的问题是 tabs 指令在 ng-repeat 指令之前运行.

有没有办法让 tabs 指令在包含 nag-tab 指令内容的所有指令之后运行(ng-repeat 或其他任何可能放在那里的指令)?

解决方案

一个指令可以在三个不同的时间运行"，因为一个指令可以有编译、预链接和后链接方法.这个 plunker 包含两个示例 HTML 结构 –一种使用 ng-repeat，一种不使用 –它会在 3 个指令函数中的每一个运行时打印出来.

对于 ng-repeat 示例，我们看到 ng-repeat 前链接和后链接函数在 nag-tabs 后链接之后运行.因此，如果您想让 tabs 指令在 ng-repeat post-link 函数运行后执行某些操作，则必须使用 $timeout(如@charlietfl 建议)或 $watch 或事件来执行代码稍后.

您可以尝试向 ng-repeat 元素添加一个 checklast 指令，当 $last 为 true 时，该指令可以向您的 tabs 指令发出信号.信号可以通过事件完成，或者 checklast 指令可以 require 您的 tabs 指令，然后 checklast 指令可以调用 tabs 指令控制器上的方法.另请参阅https://stackoverflow.com/a/13906907/215945.

请注意，这个漂亮的 plunker 来自 Peter.>

I have the following html:

<div nag-tabs="tabsOptions">
    <ul class="tabs">
            <li ng-repeat="tab in tabs">{{ tab }}</li>
    </ul>
    <div class="tab_content">
            <div ng-repeat="tabContent in tabsContent">{{ tabContent }}</div>
    </div>
</div>

The issue that I am having is that the tabs directive is running before the the ng-repeat directive.

Is there any way to get the tabs directive to run after all the directives that encompasses the content of the nag-tab directive run (ng-repeat or whatever else might be put in there)?

解决方案

A directive can "run" at three different times, because a directive can have compile, pre-link, and post-link methods. This plunker contains two sample HTML structures – one uses ng-repeat, one doesn't – and it prints out when each of the 3 directive functions runs.

For the ng-repeat example, we see that the ng-repeat pre- and post- link functions run after the nag-tabs post-link. So if you want to have the tabs directive do something after the ng-repeat post-link functions run, you'll have to use a $timeout (like @charlietfl suggested) or a $watch, or an event, to execute the code later.

You could try adding a checklast directive to the ng-repeat element which could signal your tabs directive when $last is true. Signalling could be done via an event, or the checklast directive could require your tabs directive and then the checklast directive could call a method on your tabs directive's controller. See also https://stackoverflow.com/a/13906907/215945.

Note, the nifty plunker came from Peter.

这篇关于让内部指令在外部指令 angularjs 之前运行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！