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私の最初のアイデアは、 で として機能するビューをプッシュするためにを拡張することでしoutletたEmber.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 に答える