私にはかなり大きな例がありますが、問題は、初めてページネーションルートに移行するときにすべてが良好であるということです。しかし、別のものをクリックしようとすると（ページネーションイベントを開始する）、以下のエラーが発生します
これはember-dataを使用しており、オブジェクトはRESTエンドポイントにデータバインドされているため、jsfiddleはありません。
emberバージョンは、最新のember-data+ハンドルバー-1.0.0.beta.6およびjQuery1.7.2を使用した1.0より前のバージョンです。
キャッチされないエラー：状態root.paginatedのイベントpaginateUsersに応答できませんでした。
これが私のテンプレートと残り火アプリです
<script type="text/x-handlebars" data-template-name="person">
<table>
<thead></thead>
<tbody>
{{#each person in controller.paginatedContent}}
<tr>
<td>{{person.id}}</td>
<td>{{view Ember.TextField valueBinding="person.username"}}</td>
<td><input type="submit" value="update" {{action updatePerson person}}/></td>
<td><input type="submit" value="delete" {{action removePerson person}}/></td>
</tr>
{{/each}}
</tbody>
</table>
<ul class="pagination gui-text">
<li name="prev"><span class="paginator" {{action prevPage href=true target="controller"}}>Prev>
{{#each pages}}
{{view PersonApp.PaginationItemView contentBinding="this"}}
{{/each}}
<li name="next"><span class="paginator" {{action nextPage href=true target="controller"}}>Next>
</ul></li>
</script>
<script type="text/x-handlebars" data-template-name="pagination_item">
{{#with view}}
<a {{action paginateUsers content href=true}}>
<span {{bindAttr class="spanClasses isActive:active"}}>{{content.page_id}}</span>
</a>
{{/with}}
</script>
PersonApp = Ember.Application.create({});
PersonApp.ApplicationController = Ember.ObjectController.extend({});
PersonApp.ApplicationView = Ember.View.extend({
templateName: 'application'
});
PersonApp.PersonView = Ember.View.extend({
templateName: 'person',
addPerson: function(event) {
var username = event.context.username;
if (username) {
this.get('controller.target').send('addPerson', username);
event.context.set('username', '');
}
}
});
PersonApp.Person = DS.Model.extend({
id: DS.attr('number'),
username: DS.attr('string')
});
PersonApp.Store = DS.Store.extend({
revision: 4,
adapter: DS.DjangoRESTAdapter.create({
bulkCommit: false,
plurals: {
person: 'people'
}
})
});
PersonApp.PaginationItemView = Ember.View.extend({
templateName: 'pagination_item',
tagName: 'li',
spanClasses: 'paginator pageNumber',
isActive: function() {
var currentPage = this.get('parentView.controller.currentPage');
var page_id = this.get('content.page_id');
if(currentPage) {
return currentPage.toString() === page_id.toString();
} else {
return false;
}
}.property('parentView.controller.currentPage')
});
PersonApp.PersonController = Ember.ArrayController.extend({
content: [],
sortProperties: ['id'],
pages: function() {
var availablePages = this.get('availablePages'),
pages = [],
page;
for (i = 0; i < availablePages; i++) {
page = i + 1;
pages.push({ page_id: page.toString() });
}
return pages;
}.property('availablePages'),
currentPage: function() {
return this.get('selectedPage') || 1;
}.property('selectedPage'),
nextPage: function() {
var availablePages = this.get('availablePages');
var currentPage = parseInt(this.get('currentPage'), 10);
var pages = this.get('pages');
var nextPage;
nextPage = currentPage + 1;
if(nextPage > availablePages) {
nextPage = nextPage - availablePages;
}
PersonApp.get('router').send('paginateUsers', pages[nextPage - 1]);
},
prevPage: function() {
var availablePages = this.get('availablePages');
var currentPage = parseInt(this.get('currentPage'), 10);
var pages = this.get('pages');
var nextPage;
nextPage = currentPage - 1;
if(nextPage <= 0) {
nextPage = nextPage + availablePages;
}
PersonApp.get('router').send('paginateUsers', pages[nextPage - 1]);
},
availablePages: function() {
var length = this.get('filteredContent.length');
var itemsPerPage = 2;
return (length / itemsPerPage) || 1;
}.property('filteredContent.length'),
paginatedContent: function() {
var filteredContent = this.get('filteredContent');
var selectedPage = this.get('selectedPage') || 1;
var itemsPerPage = 2;
var upperBound = (selectedPage * itemsPerPage);
var lowerBound = (selectedPage * itemsPerPage) - itemsPerPage;
return this.get('filteredContent').slice(lowerBound, upperBound);
}.property('selectedPage', 'filteredContent.@each'),
filteredContent: function() {
return this.get('content');
}.property('content.@each')
});
PersonApp.Router = Ember.Router.create({
root: Ember.Route.extend({
index: Ember.Route.extend({
route: '/',
paginateUsers: Ember.Route.transitionTo('paginated'),
addPerson: function(router, username) {
PersonApp.Person.createRecord({ username: username });
router.get('store').commit();
},
updatePerson: function(router, event) {
router.get('store').commit();
},
removePerson: function(router, event) {
event.context.deleteRecord();
router.get('store').commit();
},
connectOutlets: function(router) {
router.get('applicationController').connectOutlet('person', router.get('store').findAll(PersonApp.Person));
}
}),
paginated: Ember.Route.extend({
route: '/page/:page_id',
connectOutlets: function(router, context) {
router.get('personController').set('selectedPage', context.page_id);
},
exit: function(router) {
router.get('personController').set('selectedPage', undefined);
}
})
})
});
$(function () {
PersonApp.initialize(PersonApp.Router);
});