web-dev-qa-db-de.com

Sortieren einer Backbone-Sammlung nach der Initialisierung

Ich verwende Backbone.js, um eine Liste von Elementen, z. B. Bücher, zu rendern. Nach dem Rendern der Liste stehen dem Benutzer Optionen zum Sortieren zur Verfügung. Wenn der Benutzer auf Nach Titel sortieren oder Nach Autorenname sortieren klickt, sortiert sich die Liste selbst auf der Clientseite.

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

Was ist der beste Weg, um diese Sortierung im Kontext einer Backbone-Anwendung durchzuführen? Verwende ich im AppView einen jQuery Dom Sorter?

backbone.js
52
Jhony Fung

Es gibt eine Diskussion zu diesem Thema, die Sie sich ansehen sollten: https://github.com/documentcloud/backbone/issues/41 .

Kurz gesagt: Wenn ein Benutzer "Nach X sortieren" auswählt, können Sie:

  1. Setzen Sie die Funktion comparator für die Collection
  2. Rufen Sie die Funktion sort der Sammlung auf (die ein sort -Ereignis auslöst).
  3. Warten Sie in Ihrer Ansicht auf das Ereignis sort und zeichnen Sie die Elemente neu

Eine andere Möglichkeit, mit den Schritten 1 und 2 umzugehen, besteht darin, eine eigene Methode zu haben, die die sortBy -Methode der Sammlung aufruft und dann ein benutzerdefiniertes Ereignis auslöst, das Ihre Ansicht abhören kann.

Es scheint jedoch so zu sein, dass das Löschen und Neuzeichnen der einfachste (und vielleicht sogar schnellste) Weg ist, Ihre Ansichten zu sortieren und sie mit der Sortierreihenfolge Ihrer Sammlung synchron zu halten.

50
satchmorun

Sie können die Komparatorfunktion aktualisieren und dann die Sortiermethode aufrufen.

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

// call the sort method
collection.sort();

Die Ansicht wird automatisch neu gerendert.

48
jpanganiban

comparator ist was Sie brauchen

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

Dieser Weg funktioniert gut und ermöglicht das dynamische Sortieren nach allen attributes und behandelt ascending oder 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;
    }
});
3
Loourr