Ember数据：在数组的开头插入新的项目而不是结尾 [英] Ember data: Insert new item at beginning of array instead of at the end

问题描述

在我的应用程序中，我显示消息的时间线。我们从服务器按时间顺序从时间顺序检索它们，最新到最旧。

  3  -  Howdy 
 2  - 问候
 1  -  Mahalo 
  

我们的用户还可以添加一个默认的新消息获取插入队列的末尾像这样

  3  -  Howdy 
 2  - 问候语
 1  -  Mahalo 
 4  - 我是新消息，像往常一样
  

当我提交时，我喜欢新消息显示在顶部。我之前已经写了一个函数来反转项目数组，但是这对于数组中的项目来说是无效的。

  4  - 我是新消息，首先是
 3  -  Howdy 
 2  - 问候语
 1  -  Mahalo 
  

在这种情况下，最好的方法是什么？理想情况下，Ember Data可以预先添加到内容数组，而不是追加。还有另外一个选择可能会更好吗？

解决方案

对于大多数涉及排序的场景，建议使用 Ember.SortableMixin ，被烘烤成 Ember.ArrayController 。

请参阅JSFiddle中的这个概念性示例： http：// jsfiddle .net / schawaska / tbbAe /

在这个示例中，该模型有一个 DateTime code>当我用于过滤的：

  App.Greeting = DS.Model.extend（{
 text：DS.attr（'string'），
 when：DS.attr（'date'）
}）; 
 
 App.Greeting.FIXTURES = [
 {id：1，text：'First'，when：'3/4/2013 2:44:52 PM'}，
 {id：2，text：'Second'，when：'3/4/2013 2:44:52 PM'}，
 {id：3，text：'Third'，when：'3/4 / 2013 2:44:52 PM'}，
 {id：4，text：'Fourth'，when：'3/4/2013 3:44:52 PM'} 
]; 
  

在控制器中，我唯一需要做的是设置属性的名称和排序方向：

  App.SortingMixinController = Em.ArrayController.extend（{
 sortProperties：['when']，
 sortAscending：false 
}）; 
  

然后在我的Handlebars模板中，我可以使用 {{each}} helper，因为我正常地。

因为在这个示例中，所有的日期是相同的，除了 Forth （这是因为排序首先出现），并且还因为 SortableMixin ，这些值将通过另一个属性进行排序 - 我假设这里的Id。

我在该小提琴中采用的另一种方法是使用计算属性。我似乎不太了解这种方法，因为它似乎消耗更多的资源，而 App.SortingPropertyController 中的代码值得笑，但是为了显示可能性而进行的工作。 / p>

In my application I'm displaying a timeline of messages. We retrieve them from the server in descending chronological order, newest to oldest.

3 - Howdy
2 - Greetings
1 - Mahalo

Our users also have the ability to add a new message which by default gets inserted at the end of the queue like so

3 - Howdy
2 - Greetings
1 - Mahalo
4 - I'm the new message, last as usual

When I submit, I'd like new messages to show up at the top. I've written a function before that reverses the array of items, but that wouldn't work for items already in the array.

4 - I'm the new message, first finally
3 - Howdy
2 - Greetings
1 - Mahalo

What would be the best approach in this case? The ideal would be for Ember Data to prepend to the content array rather than append. Is there another option which might be better?

解决方案

For most scenarios involving sorting it's recommented to use Ember.SortableMixin, which is baked into Ember.ArrayController.

Please refer to this conceptual example in JSFiddle: http://jsfiddle.net/schawaska/tbbAe/

In this sample the model has a DateTime field named when, which I'm using for filtering:

App.Greeting = DS.Model.extend({
    text: DS.attr('string'),
    when: DS.attr('date')                  
});

App.Greeting.FIXTURES = [
    {id: 1, text: 'First', when: '3/4/2013 2:44:52 PM'},
    {id: 2, text: 'Second', when: '3/4/2013 2:44:52 PM'},
    {id: 3, text: 'Third', when: '3/4/2013 2:44:52 PM'},
    {id: 4, text: 'Fourth', when: '3/4/2013 3:44:52 PM'}
];

In the controller the only thing I have to do is to set the name of the property and the sorting direction:

App.SortingMixinController = Em.ArrayController.extend({
    sortProperties: ['when'],
    sortAscending: false
});

Then in my Handlebars template, I can use the {{each}} helper as I would do normally.

Because in this sample, all the dates are the same except for the Forth (which because of sorting appears first), and also because of SortableMixin, these values will be sorted through another property - I'm assuming the Id here.

The other approach I've taken in that fiddle is using a computed property. I'm not really sure about that approach as it seems to consume more resources and the code in App.SortingPropertyController is worthy of laugh, but sort of works to show possibilities.

这篇关于Ember数据：在数组的开头插入新的项目而不是结尾的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！