在Ember.ListView中添加插座

我正在创建一个应用程序，其外观和感觉类似于谷歌图像搜索：

我使用

Ember.ListView

（）成功创建了图像列表。我想有一个列表/详细信息界面，详细信息将显示在一个弹出窗口中（比如在谷歌：尝试点击一张图片）

因此，模板如下所示：

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

我可以在DOM中看到

App.AnOutletView

的实例，但是里面没有渲染任何内容。我会很惊讶，如果这是工作

知道如何在

Ember.ListView

中添加一个插座吗？任何想法都将不胜感激

---

非常感谢

为什么不这样做列表项的模板呢

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

{{#如果扩展了}
{{/if}