Question

您好，我有一个属于我的小型余烬应用程序的小问题。 JSFiddle上传就在这里。我使用bootstrap手风琴来显示我的门票。当我点击“点击”时，它会在我的视图中添加另一个手风琴。但遗憾的是它无法打开或使用。我动态创建的每个手风琴都无法打开或关闭。没有错误或异常抛出，从我的角度来看，一切都应该正常工作。我的点击功能如下所示：

click: function() {
    this.counter++,
    name = this.name+this.counter.toString(),
    tre = App.Ticket.create({
        Text: "try",
       id: name
    });

    this.pushObject(tre);
}});

所属的html在这里：

<div class="accordion-group">
    {{#each content}}
       <div class="accordion-heading">
           <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" {{bindAttr href="id"}}>
                 Ticket ID/Störfall
           </a>
        </div>
        <div {{bindAttr id="id"}} class="accordion-body collapse in ">
             <div class="accordion-inner">
                 {{Text}}
             </div>
         </div>
     {{/each}}
</div>

我希望你能帮助我。

Answer 1

您可以为手风琴链接标题添加动作助手

<a class="accordion-toggle" data-toggle="collapse" 
data-parent="#accordion2" 
{{bindAttr href="item.id"}} 
{{action "click" item target="view"}}>
     Ticket ID/Störfall
</a>

然后在视图中实现点击处理程序事件

   App.TicketView = Em.View.extend({
        click:function(context) {
            var el = this.$('a[href='+context.get('id')+']');
            el.toggleClass('collapsed');
            this.$('#'+el.attr('href')).toggleClass('in');
        }
    });

这是一个有效的fiddle

带有灰烬的Bootstrap手风琴

1 个答案: