0

注文リストがあります。

  • 注文1
  • 注文2
  • オーダー3

    各注文にはいくつかのアイテムがあります

    • オーダー1
      • アイテム11
      • アイテム12
    • 注文2
      • アイテム21
      • アイテム22
    • オーダー3
      • item31
      • item32

    モデルを次のように定義します (hasMany 関係を使用せずに):

    App.Order = DS.Model.extend({
      orderNote: DS.attr('string')});
    
    App.Item = DS.Model.extend({
      ItemName: DS.attr('string'),
      orderId:  DS.attr('string')});
    

目的: 「index.html#/orders」をルーティングするときに、すべての注文とそのアイテムを以下のように表示したい

<ul>
  <li>
    <p>order1_note</p>
    <ul>
      <li>Item11</li>
      <li>Item12</li>
    </ul>
  </li>

  <li>
    <p>order2_note</p>
    <ul>
      <li>Item21</li>
      <li>Item22</li>
    </ul>
  </li>

  <li>
    <p>order3_note</p>
    <ul>
      <li>Item31</li>
      <li>Item32</li>
    </ul>
  </li>
</ul>

ネストされた each ヘルパーを使用しようとしましたが、

私が使う

var currentOrderId = order.get('id');

var ret = this.store.filter('item',{pid,currentOrderId},function(item){return item.get('orderId')=currentOrderId} )</p>

しかし、フィルター結果(約束)を自分のテムレートでorderItemsとして使用するにはどうすればよいですか?

<ul> 
  {{#each order in orders ItemController="order"}}
    <li>
    {{orderNote}}
        <ul>
        {{#each orderItems}}
            <li>item</li>
        {{/each}}
        </ul>
    </li> 
   {{/each}} 
 </ul>

編集

この投稿のおかげで、find と filter についての優れた説明があり、コントローラーでの自己の刺激的な使用法 (( ember-data からフィルター処理された結果に項目を追加する )) のおかげで、うまくいきましたが、それでも、これは正しい「Ember の方法」ですか? ?

<script type="text/x-handlebars" data-template-name="orders">
    <ul>
      {{#each order in controller itemController= 'order'}}
        <li>{{name}}</li>
        <hr /> 
      <ul>
        {{#each item in items.content}}
            <li>
              {{item.name}}
            </li>
        {{/each}}
      </ul>
      {{/each}}
    </ul>
  </script>

そして、ここにitemControllerがあります

App.ProjectController =Ember.ObjectController.extend({
  oid:function(){
    return this.get('content').get('id');
  }.property(),

  items: function(){
    var self = this;
    var oid = self.get('id');
    var itemPromise=  self.store.filter('item', {orderId: oid},function (item) {
      return item.get('orderId')==oid;
    });
    //itemPromise is  a promise.
    // cached in the callback as value?
    itemPromise.then(function(value){
      self.set('items',value);
    });
  }.property()

});
4

1 に答える 1

0

いいえ、これは本当の Ember Way ではありません。代わりにbelongsToandhasManyを使用して、モデル間の関係を直接設定する必要があります。

App.Order = DS.Model.extend({
  orderNote: DS.attr('string'),
  items:     DS.attr('hasMany')
});

App.Item = DS.Model.extend({
  ItemName: DS.attr('string'),
  order:    DS.attr('belongsTo')
});

そして、テンプレートはitemsコレクションを使用するだけです。

<script type="text/x-handlebars" data-template-name="orders">
<ul> 
  {{#each order in orders ItemController="order"}}
    <li>
    {{orderNote}}
        <ul>
        {{#each items}}
            <li>{{ItemName}}</li>
        {{/each}}
        </ul>
    </li> 
  {{/each}} 
</ul>
</script>

詳細については、「モデルの検索」に関するガイドの「関係の定義」セクションを参照してください。

http://emberjs.com/guides/models/defining-models/#toc_defining-relationships

于 2013-10-29T21:02:24.940 に答える