Lade Beziehungsdaten mit Ember 2

Question

Ich habe Probleme beim Laden von Beziehungsdaten mit Ember 2.0. In Anbetracht des folgenden zwei Modelle, Projekt und LineItem, ich versuche, alle Positionen zur Liste zu einem bestimmten Projekt gehören:

export default DS.Model.extend({ 
    name: DS.attr(), 
    organisation: DS.attr(), 
    customer: DS.attr(), 
    hours: DS.attr({defaultValue: 0}), 
    line_items: DS.hasMany('line-item', {async: true}) 
}); 

export default DS.Model.extend({ 
    name: DS.attr(), 
    value: DS.attr({defaultValue: 1}), 
    quantity: DS.attr({defaultValue: 1}), 
    state: DS.attr({defaultValue: 'OPEN'}), 
    project: DS.belongsTo('project') 
}); 

In meinem Weg, lade ich ein bestimmtes Projekt ohne Probleme:

export default Ember.Route.extend(AuthenticatedRouteMixin, { 
    model(params) { 
     return this.store.findRecord('project', params.project_id); 
    } 
}); 

In meiner Komponente versuche ich dann, meine Werbebuchungen wie folgt zu laden:

Import Ember from 'ember';

export default Ember.Component.extend({ 
    store: Ember.inject.service(), 
    lineItems: function() { 
     return this.get('project').get('line_items').toArray(); 
    }.property('project.line_items'), 
}); 

Wenn ich versuche aber meine Positionen in meiner Vorlage iterieren, passiert nichts:

{{#each lineItems as |item|}} 
    <tr> 
    <td> 
     <a href="#">{{item.name}}</a> 
    </td> 
    </tr> 
{{/each}} 

Kein Glück {{#each project.line_items as |item|}} entweder verwenden. Das Drucken der Ausgabe von this.get('project').get('line_items').toArray() zeigt eine leere Liste.

jedoch mein Projekt Positionen enthält, wie erwartet:

{ 
    "data":{ 
     "type":"projects", 
     "id":"7d93633d-a264-4cb3-918c-82cc44cb76e2", 
     "attributes":{ 
     "created":"2016-04-04T19:02:03.113408Z", 
     "modified":"2016-04-04T19:02:03.113511Z", 
     "name":"Sample name", 
     "hours":0 
     }, 
     "relationships":{ 
     "line_items":{ 
      "meta":{ 
       "count":1 
      }, 
      "data":[ 
       { 
        "type":"LineItem", 
        "id":"01915d73-fde5-4b6f-8915-174c16592942" 
       } 
      ] 
     } 
     } 
    } 
} 

... meine Position:

 { 
      "type": "line-items", 
      "id": "01915d73-fde5-4b6f-8915-174c16592942", 
      "attributes": { 
       "created": "2016-04-04T19:02:15.622483Z", 
       "modified": "2016-04-04T19:02:15.622534Z", 
       "name": "Test Line Item", 
       "value": 1, 
       "quantity": 1 
      }, 
      "relationships": { 
       "project": { 
        "data": { 
         "type": "projects", 
         "id": "7d93633d-a264-4cb3-918c-82cc44cb76e2" 
        } 
       } 
      } 
     } 

Answer 1

Ich habe Ihren Code getestet und yep, es funktioniert nicht. Es funktioniert nur, wenn ich das Modell "Artikel" und "Artikel" überall umbenenne. Es sieht für mich aus, dass Ember Data keine verketteten Modellnamen mag ...

Also, als Schlussfolgerung sollten wir einfach überall einen Namen verwenden oder die genaue Syntax herausfinden ... camelCase, dash- erized oder unter_scored?

Answer 2

würde ich vorschlagen, folgendes zu tun: Laden Sie das Projekt in Ihrer Route als Du machst es jetzt. Übergeben Sie die Projektinstanz in die Komponente, anstatt die Geschäftsinstanz zu importieren.

// template which gets rendered after model() hook 
... 
{{#if model}} 
    {{!-- pass the model into your component as 'project' --}} 
    {{your-component project=model}} 
{{/if}} 
... 

In Ihrer Komponente Vorlage können Sie überprüfen, ob asynchron geladen Beziehungen geladen wurden und zeigen entsprechenden Abschnitt danach:

// template which gets rendered by your component as the project instance is present 
{{#if project.line_items}} {{!-- #if project.lineItems --}} 
    {{!-- iterate over line items and print their names --}} 
    <ul> 
    {{#each project.line_items as |item|}} 
    <li>Line item name: {{item.name}}</li> 
    {{/each}} 
    </ul> 
{{/if}} 
... 

Wenn alles gut geht, soll diese Arbeit. Ihre Komponente benötigt weder einen Speicher noch eine berechnete Eigenschaft für project.line_items.