引导扩展与ember.js模板 [英] Bootstrap Popovers with ember.js template

问题描述

我正在尝试使用EmberJS的 Bootstrap Popover ，以便Popover的内容将做一个ember / handlebars模板（绑定等）。如何才能做到这一点？ （Ember 1.0.0-rc2）

I'm trying to use Bootstrap Popover with EmberJS, so that the content of the popover will be a ember/handlebars template (with binding etc). How can this be done? (Ember 1.0.0-rc2)

推荐答案

这是Ember bootstrap popover的一个工作示例（请参阅 http://jsfiddle.net/72fSd/ ）：

Here is a working example for an ember bootstrap popover (see 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 App.Popover templateName="my-popover-content" parentSelector=".popoverButton" contentSelector="#popovercontent"}}

这里， parentSelector 可能g。选择一个按钮。确保您的my-popover内容模板中有一个id为#popovercontent的div容器，以使 contentSelector 正常工作。当然，您需要在初始化视图之前加载模板。

Here, parentSelector might e.g. select a button. Make sure you have a div container with id #popovercontent in your my-popover-content template in order for the contentSelector to work. Of course you need to load the template prior to initialization of the view.

双向绑定应该与该解决方案配合使用。

Two-way binding should work with that solution.

这篇关于引导扩展与ember.js模板的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！