0

我将 emberjs 与 twitter-bootstrap 一起使用，但只有 css，所以没有从 bootstrap 中获取 javascript。

我想让弹出框工作，它会弹出，但popover-content没有显示，即使它已设置。这是我的代码：

popoverTemplate.hbs：

<div class="popover fade right in" style="top: 12.5px; left: 242px; height:200px;width:200px; display: block;">
<div class="arrow"></div>
<h3 class="popover-title">A Title</h3>
<div class="popover-content">And here's some amazing content. It's very engaging. right?</div>

我的观点：

 App.PopoverView = Ember.View.extend({
     templateName: 'popoverTemplate'
 });

这是发出切换行为的控制器：

    showPopover: null,
    init:function(){
        this.set('showPopover',false);
    },
    togglePopoverView: function(){
        this.set('showPopover',!this.get('showPopover'));
    }

这是我的主模板，我在其中设置了弹出框的逻辑：

     {{#if showPopover}}
                {{view App.PopoverView}}
     {{/if}}

更新 我想通了，不幸的是你在我的代码中找不到错误——至少我放在这里的。问题是，在一开始我的模板中，我已经用#with助手设置了上下文并忘记了它。所以很可能我会删除这个问题。谢谢你的贡献。

4

2 回答 2

1

当 Ember 将您的弹出框插入 DOM 时注册您的弹出框。这就是我在我的项目中所做的。不完全是，但我希望这能给你一个线索来完成这项工作。

App.PopoverView = Ember.View.extend({
    templateName: 'popoverTemplate',
    didInsertElement: function() {
       this.$('.popover').popover(
            {
                title: $(this).attr('data-title'),
                content: $('#popover-content').html() });
            });
    }
});

您的 HTML 应如下所示：

<a class="popover" data-title="Title Here">Toggle Popover</a>
<div id="popover-content">
   <!-- content... -->
</div>

应该在没有额外代码的情况下工作，当您单击链接时会使用弹出框切换。

于 2013-09-09T15:43:25.573 回答
0

您的实施似乎没有任何问题。

这是您的实施的工作箱

于 2013-09-09T15:42:07.963 回答