twitter-bootstrap - 使用 ember.js 模板 Bootstrap 弹出框

Question

我正在尝试使用 Bootstrap Popover使用 EmberJS，因此弹出框的内容将是 ember/handlebars 模板(带有绑定(bind)等)。如何才能做到这一点？ ( Ember 1.0.0-rc2)

Answer 1

下面是一个 ember Bootstrap 弹出窗口的工作示例(参见 http://jsfiddle.net/72fSd/):

App.Popover = Ember.View.extend({
        parentSelector: '',
        contentSelector: '',
        didInsertElement: function () {
            var self = this;
            $(self.parentSelector).popover({
                html: true,
                content: function() {
                    var $content = $(self.contentSelector);
                    return $content.html();
                }
            });
        }

实例化 View :

{{view App.Popover templateName="my-popover-content" parentSelector=".popoverButton" contentSelector="#popovercontent"}}

在这里， 父选择器 可能例如选择一个按钮。确保您的 my-popover-content 模板中有一个 ID 为 #popovercontent 的 div 容器，以便使用 。内容选择器 去工作。当然，您需要在 View 初始化之前加载模板。

双向绑定(bind)应该适用于该解决方案。