如何使用EMBER.SORTABLEMIXIN？

Question

我FIXTURES包含了我想根据ID排序的产品数组.

Astcart.Application.FIXTURES=[
{
    "name" : "astr",
    "home_products": [
        {
            "id": 3,
            "name": "Mobiles & Accessories"
        },
        {
            "id": 2,
            "name": "Mobiles & Accessories"
        },
        {
            "id": 1,
            "name": "Mobiles & Accessories"
        }
    ]
}
];

我没有得到完整的例子.EMBER.SORTABLEMIXIN我对在ember中排序没有任何想法.

任何人都可以解释我如何使用我的这个例子在ember中进行排序(不工作)？

Answer 1

可排序的功能由Ember.SortableMixin提供.这个mixin暴露了两个属性:sortAscending和sortProperties.

• 在sortAscending接受一个布尔值确定所述排序是方兴未艾与否.

• 而sortProperties期望与属性的数组排序.

例如:

调节器

App.IndexController = Ember.Controller.extend(Ember.SortableMixin, {
    sortAscending: false,
    sortProperties: ['id'],
});

可以更改这些属性并更新订单,这是一个动态排序的示例:

调节器

App.IndexController = Ember.Controller.extend(Ember.SortableMixin, {
    sortProperties: ['firstName'], // or whatever property you want to initially sort the data by
    sortAscending: false, // defaults to "true"
    actions: {
        sortBy: function(property) {            
            this.set('sortProperties', [property]);
        }
    }
});

要访问已排列的内容,您应该arrangedContent在模板中引用而不是常规model属性.像这样:

模板

<script type="text/x-handlebars" data-template-name="index">
    <h2>Index Content:</h2>
    <table>
      <thead>
        <th {{action "sortBy" "id"}}>ID</th>
        <th {{action "sortBy" "firstName"}}>First Name</th>
        <th {{action "sortBy" "lastName"}}>Last Name</th>
      </thead>
      <tbody>
        {{#each arrangedContent as |prop|}}
        <tr>
          <td>{{prop.id}}</td>
          <td>{{prop.firstName}}</td>
          <td>{{prop.lastName}}</td>
         </tr>
        {{/each}}
      </tbody>
    </table>
  </script>

你可以在这里看到这个http://emberjs.jsbin.com/gunagoceyu/1/edit?html,js,output

我希望它有所帮助