2015-08-23 5 views
0

Je vais avoir ce DS.Modelmodèle de filtre Dans dates en Ember Contrôleur

Model = DS.Model.extend 

    date: DS.attr "string" 
    amount_payed: DS.attr "string" 
    user_name:DS.attr "string" 

`export default Model` 

Actuellement, il n'y a rien dans mon contrôleur

Controller = Em.Controller.extend() 

export default Controller

Ceci est la voie

Route = Ember.Route.extend 

    model:() -> 
    return @store.find "user-account" 

`export default Route` 

De serveur j'obtiens une réponse en JSON avec valeur de date comme

"date": "1995-12-25 00:00:00" 

C'est le modèle exemple

{{#each detail in model}} 
<li>{{detail.date}}{{detail.amount_paid}}{{detail.user_name}}</li> 
{{/each}} 

Comment je tri/filtrage du modèle dans mon contrôleur de sorte que lorsque le modèle rend la modèle en utilisant {{#each detail in model}} les détails avec les dernières dates sont affichés en premier.Basiquement, je veux trier le modèle en utilisant la propriété de date.La date de rappel vient comme "date": "1995-12-25 00:00:00". sera ok si u guys peut donner une solution javascript aussi (pas nécessairement coffeescript)

Répondre

2

Il y a plusieurs façons dont vous pouvez faire: computed.sort, SortableMixin, mettre en œuvre une fonction de tri personnalisée. Le plus difficile actuellement est que vos dates sont des chaînes, vous devrez donc les convertir en quelque chose que vous pouvez exécuter des comparaisons (soit des horodatages numériques, ou des objets de date, etc.). Vous pouvez soit effectuer cette conversion pendant le tri (dans la fonction de tri), soit sur le modèle lui-même afin de pouvoir réutiliser et mettre en forme la date plus facilement dans d'autres endroits de votre application.

L'exemple que je fournis ci-dessous fait la conversion pendant le tri. Notez que vous ne pouvez pas faire (new Date (string)) à cause d'un bug avec l'analyse de date dans Safari.

Cette réponse suppose l'utilisation de Ember-cli et syntaxe est la meilleure pratique actuelle de Ember 2.0

Docs pour computed.sort sont ici: http://emberjs.com/api/classes/Ember.computed.html#method_sort

import Ember from 'ember'; 

const { 
    computed, 
    Controller 
} = Ember; 

export default Controller.extend({ 
    sortedModel: computed.sort('model', function(a, b) { 
    let timestampA = makeTimestamp(a); 
    let timestampB = makeTimestamp(b); 

    if (timestampA > timestampB) { 
     return 1; 
    } else if (timestampA < timestampB) { 
     return -1; 
    } 
    return 0; 
    }) 
}); 


// ideally you'd just return date, and call this makeDate 
// and probably you'd do this when setting the date onto the model 
function makeTimestamp(dateString) { 
    let arr = dateString.split(/[- :]/); 
    let date = new Date(arr[0], arr[1]-1, arr[2], arr[3], arr[4], arr[5]); 
    date.setTime(date.getTime() - date.getTimezoneOffset() * 60 * 1000); 
    return date.getTime(); 
} 

Vous pouvez ensuite utiliser dans votre modèle comme ce.

{{#each sortedModel as |detail|}} 
    <li>{{detail.date}}{{detail.amount_paid}}{{detail.user_name}}</li> 
{{/each}} 

Note rapide, {{#each detail in model}} est une syntaxe dépréciée, la syntaxe actuelle comme de ~ 1.10 est {{#each model as |detail|}}.