Tri d’une collection de backbone Après l’initialisation

J’utilise Backbone.js pour afficher une liste d’éléments, par exemple Books. Après le rendu de la liste, l’utilisateur dispose d’options pour les sortinger. Ainsi, si l’utilisateur clique sur Trier par titre ou Trier par nom d’auteur, la liste sera sortingée du côté client.

window.Book = Backbone.Model.extend({ defaults: { title: "This is the title", author: "Name here" }, 

Quelle est la meilleure façon de réaliser ce sorting en utilisant une application Backbone. Est-ce que j’utilise un sortingeur jQuery dom dans l’AppView?

Il y a une discussion sur ce sujet que vous pourriez vouloir regarder: https://github.com/documentcloud/backbone/issues/41 .

En bref, lorsqu’un utilisateur sélectionne «sortinger par X», vous pouvez:

  1. Définir la fonction de comparator sur la collection
  2. Appelez la fonction de sort de Collection (qui déclenchera un événement de sort )
  3. Écoutez l’événement de sort dans votre vue et (effacez et) effacez les éléments

Une autre façon de gérer les étapes 1 et 2 consiste à utiliser votre propre méthode qui appelle la méthode sortBy de Collection, puis déclenche un événement personnalisé que votre View peut écouter.

Mais il semble que la suppression et la redéfinition constituent le moyen le plus simple (et peut-être même le plus rapide) de sortinger vos vues et de les synchroniser avec l’ordre de sorting de votre collection.

Vous pouvez mettre à jour la fonction de comparaison, puis appeler la méthode de sorting.

 // update comparator function collection.comparator = function(model) { return model.get('name'); } // call the sort method collection.sort(); 

La vue sera automatiquement restituée.

comparator est ce dont vous avez besoin

 var PhotoCollection = Backbone.Collection.extend({ model: Photo, comparator: function(item) { return item.get('pid'); } }); 

Cette méthode fonctionne bien et permet le sorting dynamic par tous les atsortingbutes et gère l’ ascending ou la descending :

 var PhotoCollection = Backbone.Collection.extend({ model: Photo, sortByField: function(field, direction){ sorted = _.sortBy(this.models, function(model){ return model.get(field); }); if(direction === 'descending'){ sorted = sorted.reverse() } this.models = sorted; } });