在Ember.ListView中添加插座

我正在创建一个应用程序，其外观与Google图片搜索类似：https://www.google.ca/search?q=vancouver&um=1&ie=UTF-8&hl=en&tbm=isch&source=og&sa=N&tab=wi。在Ember.ListView中添加插座

我使用Ember.ListView（http://emberjs.com/list-view/）成功创建了图像列表。我想要一个List/Details界面，其中Details将显示在popover中（如在Google中：尝试单击图像）。

因此喜欢的模板：

{{view Ember.ListView contentBinding="model"}}{{outlet}}

会的作品。当我转换到细节时，我可以看到详细信息。但是，详细信息输出口应插入可滚动容器中，而不是在Ember.ListView之外。我的第一个想法是在Ember.ListView为了延长推一个视图，将在Ember.ListView充当outlet：现在

App.ListView = Ember.ListView.extend({ 
    itemViewClass: App.ListItemView, 
    childViewsWillSync: function() { 
    this.removeObject(this.get(this, 'anOutletView')); 

    this._super(); 
    }, 
    childViewsDidSync: function() { 
    var anOutletView = this.get(this, 'anOutletView'); 

    this._super(); 

    if (!anOutletView) { 
     anOutletView = App.AnOutletView.create(); 
     this.set('anOutletView', anOutletView); 
    } 

    this.pushObject(anOutletView); 
    } 
}); 

App.AnOutletView = Ember.View.extend({ 
    template: Ember.Handlebars.compile('{{outlet}}') 
});

我的模板是：

{{view App.ListView contentBinding="model"}}

我能看到的App.AnOutletView实例在DOM中，但是没有任何内容被渲染。如果这一切能够奏效，我会感到惊讶！

任何想法如何在Ember.ListView上添加插座？任何想法，将不胜感激。

很多谢谢

来源

2013-04-25 Karl Guillotte

为什么不只是为这样的列表项目做模板？

<!-- Not expanded --> 
{{#if isExpanded}} 
    <!-- Expanded --> 
{{/if}}

来源

2013-04-26 06:39:23 Myslik

在Ember.ListView中添加插座

回答

相关问题