0

我正在创建一个外观类似于 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我使用（http://emberjs.com/list-view/）成功创建了图像列表。我想要一个列表/详细信息界面，其中详细信息将显示在弹出窗口中（例如在 Google 中：尝试单击图像）。

所以像这样的模板：

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

会工作。当我转换到详细信息时，我可以看到详细信息弹出框。但是，Details 插座应插入可滚动容器中，而不是Ember.ListView. 我的第一个想法是扩展以推动一个视图，该Ember.ListView视图将充当：outletEmber.ListView

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"}}

我可以在 DOM 中看到 的实例App.AnOutletView，但是内部没有呈现任何内容。如果这一直有效，我会感到惊讶！

知道如何在其中添加一个插座Ember.ListView吗？任何想法，将不胜感激。

非常感谢

4

1 回答 1

0

你为什么不像这样为列表项做模板呢？

<!-- Not expanded -->
{{#if isExpanded}}
    <!-- Expanded -->
{{/if}}
于 2013-04-26T06:39:23.123 回答