7

私は、emberjs でマスター/詳細ビューを実装することに少しこだわっています。

私のビューのほとんどには、タイトルのリストであるマスター ビューがあります。次に、ユーザーがそのようなタイトルをクリックすると、詳細ビ​​ューのオーバーレイが表示されます (典型的なニュースサイトのページに似ています)。

ここで、ember が master-view の情報を要求すると、次のような URL を呼び出すことに気付きました/backend/newsitems。しかし、これらの呼び出しは非常に重くなる可能性があります。これは、バックエンドがすべての newsitem のリストとそのすべての詳細データを返すためです。しかし、ユーザーはマスター ビューしか見ておらず、詳細情報をまだ要求していないため、これは間違っているように感じます。

マスタービューにはいくつかの属性のみが必要であり、詳細情報のリクエストではその特定のアイテムの追加属性を取得する必要があることを明確にする方法はありますか?

例として、私のモデルは次のようになります。

App.Newsitem = DS.Model.extend({
  slug: DS.attr('string'),
  type: DS.attr('string'),
  title: DS.attr('string'),
  summary: DS.attr('string'),
  text: DS.attr('string'),
  thumb: DS.attr('string'),
  date: DS.attr('date'),

  mediaitems: DS.hasMany('App.Mediaitem')
});

しかし、私のマスター ビューではid type title、タイトルのリストとそのタイトルの横にアイコンを表示するだけで済みます。次に、ユーザーが 1 つの newsitem の詳細を要求すると、他のすべての属性が取得されます。

4

3 に答える 3

2

私は最近同様の問題を抱えていました。

私の API には、/booksすべてではなくいくつかのフィールドを持つオブジェクトの配列を返すエンドポイントがあります。とはGET /books/:idいえ、ID の本に関するすべての情報を得ることができます:id。

次に、Ember では、1 つの本のページに対して次のルートを設定しています。

App.BookRoute = Ember.Route.extend
  model: (params) ->
    Book.find(params.book_id)

  setupController: (controller, model) ->
    controller.set("model", model)

    unless model.get('full') is true
      model.reload().then ->
        # We now have all the information.
        # Setting `full` to `true` to prevent loading it again.
        model.set('full', true)
    return

そのため、ユーザーがリストを閲覧しているだけの場合、モデルのフィールドはほとんど空ですが、書籍の詳細ビューに到達すると、API がヒットし、追加の書籍データが同じモデル インスタンスに挿入されます。

于 2013-08-31T21:52:51.920 に答える
2

マスタービューにはいくつかの属性のみが必要であり、詳細情報のリクエストではその特定のアイテムの追加属性を取得する必要があることを明確にする方法はありますか?

確かに、しかしおそらくあなたが期待している方法ではありません。Ember モデルは非常に軽量であるため、モデルとバックエンド スキーマの間に 1 対 1 の関係を持つ必要はありません。一般的に、私は API エンドポイントの観点から ember-models を考えるのが好きです。この場合、API は 2 つの異なるデータ セットを公開しているため、最も簡単な解決策は、タイトルの軽量リストを表す個別の ember モデルを作成することです。このモデルには、独自の API エンドポイントが にあり/backend/newsitem_listingsます。

App.NewsitemListing = DS.Model.extend({
  slug: DS.attr('string'),
  type: DS.attr('string'),
  title: DS.attr('string')
});

App.NewsitemListing.find()これにより、 orを使用App.NewsitemListing.find({query: q})してリストの一部またはすべてをフェッチApp.Newsitem.find(id)し、個々のレコードの詳細をロードできます。などの関係をモデルに追加することを検討するかnewsitem: DS.hasOne('App.Newsitem')、スラッグを使用してその場でリンクを生成することができます。

于 2013-03-05T13:13:47.340 に答える