twitter-bootstrap - 我什么时候应该在 Emberjs 动态添加的 HTML 代码上调用 Twitter Bootstrap 方法？

Question

我正在使用 Emberjs、handlebars 和 Twitter Bootstrap。在我的 handlebars 模板中，我使用了 Twitter Boostrap dropdown:

<ul class="nav nav-pills">
    <li class="dropdown">
        {{#each content}}
            <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button">
                <i class="icon-plus-sign">
            </a>
            <ul class="dropdown-menu" role="menu">
                <li>
                    <a href="#" {{action my_action my_argument}}> My Action </a>
                </li>
            </ul>
        {{/each}}
    </li>
</ul>

由于此 HTML 代码在页面加载时不会立即可用，而是稍后动态加载，因此在使用 AJAX 请求加载数据并填充 content 变量后，下拉菜单 无法正常工作:单击 action 链接时它不会关闭。

我知道要使这项工作正常进行，我需要在 dropdown 元素位于 DOM 中之后执行类似的操作:

$('.dropdown-toggle').dropdown();

在 Emberjs 中，是否有回调或我可以在将数据添加到 DOM 之后执行此操作的地方？

Answer 1

这种调用应该在 View 中使用，在didInsertElement 函数中。参见:http://emberjs.com/api/classes/Ember.View.html#event_didInsertElement

我知道还有一些关于这个的其他 SO 问题/答案...但我懒得去搜索你 :p