[英]How to sort hasMany items in Ember.js
我有這個結構:
App.Router.map(function() {
this.resource('board', {path: '/board'}, function() {
this.route('new', {path: '/new'});
this.route('show', {path: '/show/:board_id'});
});
});
App.Board = DS.Model.extend({
title: DS.attr('string'),
initialAmount: DS.attr('number'),
initialDate: DS.attr('date'),
boardItems: DS.hasMany('BoardItem'),
_csrf: DS.attr()
});
App.BoardItem = DS.Model.extend({
title: DS.attr('string'),
income: DS.attr('number'),
outcome: DS.attr('number'),
date: DS.attr('date'),
itemType: DS.attr('string'),
board: DS.belongsTo('Board')
});
App.BoardShowRoute = Ember.Route.extend({
model: function(params) {
return this.store.find('board', params.board_id).sort();
}
});
在視圖中,我列出了這樣的董事會項目:
{{#each boardItems}}
我想要做的是按日期排序boardItems,我找不到這樣做的方法......任何想法?
謝謝!
您應該在視圖后面的控制器中創建一個計算屬性
App.BoardShowController = Em.ObjectController.extend({
sortedBoardItems: function(){
return this.get('boardItems').sortBy('date');
}.property('boardItems.@each.date')
});
{{#each sortedBoardItems}}
您可以使用{{render}}
幫助程序包裝{{#each}}...{{/each}}
循環,並在控制器中進行排序:
App.BoardItemsController = Ember.ArrayController.extend({
sortProperties: ['date'],
sortAscending: false // newest first
});
{{#render "boardItems" boardItems}}
{{#each arrangedContent}}
Title: {{title}}
...
{{/each}}
{{/render}}
使用computed屬性進行排序將導致每次boardItems
更改時完全重新計算已排序的數組。 這里描述的arrangedContent
方法不是這種情況。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.