{{lineItem.product.name}}不使產品名稱

Question

的InvoicehasManylineItems和lineItembelongsTo一個Product。

我想重複，以發票的全部了LineItem並呈現與產品名稱的表：

<script type="text/x-handlebars" data-template-name="invoice"> 
    <h1>Invoice #{{number}}</h1> 
    <table> 
    <tr><th>Amount</th><th>Product</th></tr> 
    {{#each lineItem in lineItems}} 
    <tr> 
     <td>{{lineItem.amount}}</td> 
     <td>{{lineItem.product.name}}</td> 
    </tr> 
    {{/each}} 
    </table> 
</script> 

但{{lineItem.product.name}}不起作用。我該如何編碼？

我app.js：

App = Ember.Application.create(); 

// Router 
App.Router.map(function() { 
    this.resource('invoice', { path: '/' }); 
}); 

App.InvoiceRoute = Ember.Route.extend({ 
    model: function() { 
    return App.Invoice.find(1); 
    } 
}); 

// Models 
App.Store = DS.Store.extend({ 
    revision: 11, 
    adapter: 'DS.FixtureAdapter' 
}); 

App.Invoice = DS.Model.extend({ 
    number: DS.attr('string'), 
    lineItems: DS.hasMany('App.LineItem') 
}); 

App.LineItem = DS.Model.extend({ 
    amount: DS.attr('number'), 
    invoice: DS.belongsTo('App.Invoice'), 
    product: DS.belongsTo('App.Product') 
}); 

App.Product = DS.Model.extend({ 
    name: DS.attr('string'), 
    lineItems: DS.hasMany('App.LineItem') 
}); 

App.Invoice.FIXTURES = [{ 
    id: 1, 
    number: '0001', 
    lineItems: [1, 2] 
}]; 

App.LineItem.FIXTURES = [{ 
    id: 1, 
    invoice_id: 1, 
    product_id: 1, 
    amount: '2' 
}, { 
    id: 2, 
    invoice_id: 1, 
    product_id: 2, 
    amount: '1' 
}]; 

App.Product.FIXTURES = [{ 
    id: 1, 
    name: 'Apple', 
    lineItems: [1] 
}, { 
    id: 2, 
    name: 'Orange', 
    lineItems: [2] 
}]; 

Answer 1

的燈具是錯誤的。在LineItem的定義中它必須是product而不是product_id。這裏是固定代碼：

App.LineItem.FIXTURES = [{ 
    id: 1, 
    invoice: 1, 
    product: 1, 
    amount: '2' 
}, { 
    id: 2, 
    invoice: 1, 
    product: 2, 
    amount: '1' 
}];