javascript - How to use EMBER.SORTABLEMIXIN? - Stack Overflow

admin管理员组

文章数量:1332359

My FIXTURES contains array of products which i want to sort based on ID.

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

I am not getting plete example of EMBER.SORTABLEMIXIN.I don't have any idea about sorting in ember.

Can anyone explain me how to do sorting in ember using my this example(Not working)?

My FIXTURES contains array of products which i want to sort based on ID.

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

I am not getting plete example of EMBER.SORTABLEMIXIN.I don't have any idea about sorting in ember.

Can anyone explain me how to do sorting in ember using my this example(Not working)?

• javascript
• sorting
• ember.js
• handlebars.js

Share Improve this question Follow asked Sep 17, 2013 at 17:14 SachinSachin 2,3611111 gold badges3232 silver badges4949 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 9

The sortable feature is provided by Ember.SortableMixin. This mixin expose two properties: sortAscending and sortProperties.

• The sortAscending accepts a boolean value determining if the sort is ascendant or not.

• And the sortProperties expect an array with the properties to sort.

For instance:

Controller

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

These properties can be changed and the order will be updated, here is a sample with dynamic sort:

Controller

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]);
        }
    }
});

To access the arranged content, you should refer to arrangedContent in your template instead of the regular model property. Like this:

Template

<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>

You can see this working here http://emberjs.jsbin./gunagoceyu/1/edit?html,js,output

I hope it helps

Since Ember.SortableMixin is going to be deprecated in Ember 2.0 (as well as the ArrayController), the remended way to sort will be using Ember.puted.sort(), as illustrated here: https://stackoverflow./a/31614050/525338

本文标签： javascriptHow to use EMBERSORTABLEMIXINStack Overflow