title: How to use filter result which is a promise in an Ember js controller
body: <p>I have a list of orders.</p>
  
  <ul>
  <li>order1</li>
  <li>order2</li>
  <li><p>order3</p>
  
  <p>Each orders has some items</p>
  
  <ul>
  <li>Order1
  
  <ul>
  <li>item11</li>
  <li>item12</li>
  </ul></li>
  <li>Order2
  
  <ul>
  <li>item21</li>
  <li>item22</li>
  </ul></li>
  <li>Order3
  
  <ul>
  <li>item31</li>
  <li>item32</li>
  </ul></li>
  </ul>
  
  <p>I define the models like this(without using hasMany relationships):</p>
  
  <pre><code>App.Order = DS.Model.extend({
    orderNote: DS.attr('string')});
  
  App.Item = DS.Model.extend({
    ItemName: DS.attr('string'),
    orderId:  DS.attr('string')});
  </code></pre></li>
  </ul>
  
  <p>PURPOSE:
    When I nav to route "index.html#/orders",
    I want to show all the orders together with its Items followed as below</p>
  
  <pre><code>&lt;ul&gt;
    &lt;li&gt;
      &lt;p&gt;order1_note&lt;/p&gt;
      &lt;ul&gt;
        &lt;li&gt;Item11&lt;/li&gt;
        &lt;li&gt;Item12&lt;/li&gt;
      &lt;/ul&gt;
    &lt;/li&gt;
  
    &lt;li&gt;
      &lt;p&gt;order2_note&lt;/p&gt;
      &lt;ul&gt;
        &lt;li&gt;Item21&lt;/li&gt;
        &lt;li&gt;Item22&lt;/li&gt;
      &lt;/ul&gt;
    &lt;/li&gt;
  
    &lt;li&gt;
      &lt;p&gt;order3_note&lt;/p&gt;
      &lt;ul&gt;
        &lt;li&gt;Item31&lt;/li&gt;
        &lt;li&gt;Item32&lt;/li&gt;
      &lt;/ul&gt;
    &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>I had tried to use a nested each helper,</p>
  
  <p>I use </p>
  
  <blockquote>
    <p>var currentOrderId = order.get('id');</p>
    
    <p>var ret = this.store.filter('item',{pid,currentOrderId},function(item){return
    item.get('orderId')=currentOrderId} ）</p>
  </blockquote>
  
  <p>but how can I use the filter result(promise) as orderItems in my temlate?</p>
  
  <pre><code>&lt;ul&gt; 
    {{#each order in orders ItemController="order"}}
      &lt;li&gt;
      {{orderNote}}
          &lt;ul&gt;
          {{#each orderItems}}
              &lt;li&gt;item&lt;/li&gt;
          {{/each}}
          &lt;/ul&gt;
      &lt;/li&gt; 
     {{/each}} 
   &lt;/ul&gt;
  </code></pre>
  
  <p><strong>EDIT</strong></p>
  
  <p>Got it works, 
  thanks to this post with great explanation about find and filter,also an inspirating usage of self in controller,((
   <a href="https://stackoverflow.com/questions/9997659/adding-item-to-filtered-result-from-ember-data">Adding item to filtered result from ember-data</a>
  )) But still, is this the right "Ember way"??</p>
  
  <pre><code>&lt;script type="text/x-handlebars" data-template-name="orders"&gt;
      &lt;ul&gt;
        {{#each order in controller itemController= 'order'}}
          &lt;li&gt;{{name}}&lt;/li&gt;
          &lt;hr /&gt; 
        &lt;ul&gt;
          {{#each item in items.content}}
              &lt;li&gt;
                {{item.name}}
              &lt;/li&gt;
          {{/each}}
        &lt;/ul&gt;
        {{/each}}
      &lt;/ul&gt;
    &lt;/script&gt;
  </code></pre>
  
  <p>And here is the itemController</p>
  
  <pre><code>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()
  
  });
  </code></pre>