我无法渲染模型中的'hasMany'部分。我似乎遇到了与this guy类似的问题,但我仍然无法弄清楚要做什么。
以下是相关的JS:
App.Router.map(function() {
this.resource('account', function() {
this.resource('transaction', {
path: '/transaction/:transaction_id'
});
});
});
App.AccountIndexRoute = Ember.Route.extend({
model: function() {
return App.Account.find();
}
});
App.TransactionRoute = Ember.Route.extend({
model: function() {
return App.Transaction.find();
}
});
App.Store = DS.Store.extend({
revision: 12,
adapter: 'DS.FixtureAdapter'
});
App.Account = DS.Model.extend({
title: DS.attr('string'),
transactions: DS.hasMany('App.Transaction')
});
App.Account.FIXTURES = [
{
id: 1,
title: 'Your account',
transactions: [1, 2, 3]
}];
App.Transaction = DS.Model.extend({
date: DS.attr('date'),
name: DS.attr('string'),
amount: DS.attr('number'),
paidWith: DS.attr('string'),
account: DS.belongsTo('App.Account')
});
App.Transaction.FIXTURES = [
{
id: 1,
date: new Date(2012, 04, 17),
name: 'Item 1',
amount: 10,
paidWith: 'credit card',
account_id: 1
},
{
id: 2,
date: new Date(2012, 04, 01),
name: 'Item 2',
amount: 50,
paidWith: 'cash',
account_id: 1
},
{
id: 3,
date: new Date(2012, 03, 28),
name: 'Item 3',
amount: 100,
paidWith: 'bank transfer',
account_id: 1
}
];
模板:
<script type="text/x-handlebars" id="account/index">
<h2>Transactions</h2>
<table>
<thead>
<tr>
<th>Date</th>
<th>Item</th>
<th>Amount</th>
</tr>
</thead>
<tbody>
{{#each model}}
{{#each transaction in transactions}}
<tr>
<td>{{date transaction.date}}</td>
<td>{{#linkTo 'transaction' this}}{{transaction.name}}{{/linkTo}}</td>
<td>£{{transaction.amount}}</td>
</tr>
{{/each}}
{{/each}}
</tbody>
</table>
</script>
有人能够提供帮助吗?
答案 0 :(得分:5)
只需进行一些更改就可以了。
App.Transaction.FIXTURES
中的每个条目都应指定account
属性,而不是account_id
{{date}}
帮助器,否则{{date transaction.date}}
将无效。仅使用{{transaction.date}}
{{#linkTo 'transaction' this}}
它应该是{{#linkTo 'transaction' transaction}}
- 因为this
是对account.index controller
的引用在此处发布代码的工作副本:http://jsfiddle.net/mgrassotti/bfwhu/2/
<script type="text/x-handlebars" id="account/index">
<h2>Transactions</h2>
<table>
<thead>
<tr>
<th>Date</th>
<th>Item</th>
<th>Amount</th>
</tr>
</thead>
<tbody>
{{#each model}}
{{#each transaction in transactions}}
<tr>
<td>{{transaction.date}}</td>
<td>{{#linkTo 'transaction' transaction}}{{transaction.name}}{{/linkTo}}</td>
<td>£{{transaction.amount}}</td>
</tr>
{{/each}}
{{/each}}
</tbody>
</table>
</script>
App = Ember.Application.create({});
App.Router.map(function() {
this.resource('account', function() {
this.resource('transaction', {
path: '/transaction/:transaction_id'
});
});
});
App.IndexRoute = Ember.Route.extend({
redirect: function() {
this.transitionTo('account');
}
});
App.AccountIndexRoute = Ember.Route.extend({
model: function() {
return App.Account.find();
}
});
App.TransactionRoute = Ember.Route.extend({
model: function() {
return App.Transaction.find();
}
});
App.Store = DS.Store.extend({
revision: 12,
adapter: 'DS.FixtureAdapter'
});
App.Account = DS.Model.extend({
title: DS.attr('string'),
transactions: DS.hasMany('App.Transaction')
});
App.Account.FIXTURES = [
{
id: 1,
title: 'Your account',
transactions: [1, 2, 3]
}];
App.Transaction = DS.Model.extend({
date: DS.attr('date'),
name: DS.attr('string'),
amount: DS.attr('number'),
paidWith: DS.attr('string'),
account: DS.belongsTo('App.Account')
});
App.Transaction.FIXTURES = [
{
id: 1,
date: new Date(2012, 04, 17),
name: 'Item 1',
amount: 10,
paidWith: 'credit card',
account: 1
},
{
id: 2,
date: new Date(2012, 04, 01),
name: 'Item 2',
amount: 50,
paidWith: 'cash',
account: 1
},
{
id: 3,
date: new Date(2012, 03, 28),
name: 'Item 3',
amount: 100,
paidWith: 'bank transfer',
account: 1
}
];