Question

这是我的模型，如何在发送到模板之前对其进行排序？

route.js

import Ember from 'ember';

export default Ember.Route.extend({
  model(){
    return {
            "fruits":[
            {fruit:"mango",color:"yello"},
            {fruit:"banana",color:"muddy yellow"},
            {fruit:"apple",color:"red"}],
          "prices":[9, 10,5 ]
                }
   } 
});

Twiddle Demo

任何人请更新我的旋律？正在寻找ember approch。

这是我的hbs：

<h1>Fruit Prices Sorted here</h1> 
<ul>
{{#each sortedSongs as |price|}}
    <li> {{price.fruit}}</li>
{{/each}}
</ul>

<h1>Fruit Prices Sorted here</h1> 
<ul>
{{#each sortedPrice as |price|}}
    <li> {{price.price}}</li>
{{/each}}
</ul>

<h1>Fruit Details Sorted by Alphabetically </h1> 
<ul>
{{#each model.fruits as |fruitObject|}}
    <li> {{fruitObject.fruit}}</li>
{{/each}}
</ul>
<br>
<h1>Fruit Color Sorted by Alphabetically </h1> 
<ul>
{{#each model.fruits as |fruitObject|}}
    <li> {{fruitObject.color}}</li>
{{/each}}
</ul>

Answer 1

查看Ember.computed.sort或

在你的旋转中你应该在控制器中创建一个计算属性，它将对model.fruits进行排序并返回结果，例如：

nameSort: ['name'],
sortedByName: Ember.computed.sort('model.fruits', 'nameSort')

第二个参数必须是属性的名称，该属性包含要排序的属性数组。或者，如果您需要一些自定义排序逻辑，则可以提供功能。

我编辑过你的旋律。另外我认为price属性应该放在每个水果对象中，而不是单独的列表中，所以我移动了它。

https://ember-twiddle.com/78e0b3e9ff873a8909221efc87e3ef43

下次做一些研究时，Ember.computed.sort文档不难发现。

如何在提供给模板之前对模型数组进行排序

1 个答案: