ember.js - Ember.js {{each}} vs {{collection}}

Question

ヘルパー メソッドは、ハンドルバー テンプレート内のアイテムのリストを反復処理する 2 つの方法であることを理解eachしています。いつ使用するか、または2つの方法の違いは何かcollectionについて、実用的なアドバイスを探しています。eachcollection

Answer 1

私は Ember.js を初めて使用し、{{collection}} をまだ使用していませんが、{{collection}} (http://emberjs.com/api /classes/Ember.Handlebars.helpers.html#method_collection)、次のように推測します。

{{each}} ヘルパーは、オブジェクトのリストを繰り返し処理し、各オブジェクトに対してレンダリングされた {{each}} タグ間のコンテンツを出力します。テンプレート内の単なるループです。

{{collection}} ヘルパーもオブジェクトのリストを反復処理しますが、反復ごとにそれを含む新しい View オブジェクトを作成します。ブロック形式 ({{#collection}}{{/collection}}) を使用すると、タグ間のコンテンツが、新しく作成されたビューに関連付けられたテンプレートになります。単一タグ形式 ({{collection}}) を使用する場合、テンプレートを直接提供する代わりに、使用するビューの名前を指定すると、Ember はそのクラスのビューを作成します (一般的な Ember.View ではなく)。関連するテンプレートを使用します。

{{each}} の代わりに {{collection}} を使用する理由は、より複雑で微妙であり、実際のアプリで作業しているときにそれらに遭遇することから初めて得られるようなものに思えます-少なくとも、それはEmber の多くの部分でのこれまでの私の経験でした。たとえば、何らかの理由で、ループされたテンプレート セクションを別個のビュー オブジェクトにする必要があることに突然気付くでしょう。たとえば、追加のイベント ハンドラーを含めたり、isEditing フラグのように、ループの反復ごとに固有の追加の UI 状態を格納したりする場所が必要です。

Answer 2

質問へのコメントで @Abdull が述べているように、{{collection}}ビュー ヘルパーは廃止されたため、{{each}}推奨される使用法です。

/**
  `{{collection}}` is a `Ember.Handlebars` helper for adding instances of
  `Ember.CollectionView` to a template. See `Ember.CollectionView` for
  additional information on how a `CollectionView` functions.

  ...

  @method collection
  @for Ember.Handlebars.helpers
  @param {String} path
  @param {Hash} options
  @return {String} HTML string
  @deprecated Use `{{each}}` helper instead.
*/

ソースコード: ember.js/packages/ember-handlebars/lib/helpers/collection.js