Как отфильтровать коллекцию Backbone на сервере

Question

Существует ли общий шаблон для использования Backbone с услугой, которая фильтрует коллекцию на сервере? Я не смог найти что-либо в результатах поиска Google и Stack Overflow, что удивительно, учитывая количество приложений Backbone на производстве.

---

Предположим, что я строю новый передний конец для переполнения стека с использованием базовой линии.

На экране поиска мне нужно передать следующую информацию на сервер и получить результаты, полученные за страницу.

• критерии фильтрации
• критерии сортировки
• результатов на странице
• номер страницы не кажется

Backbone иметь большой интерес к разгружая фильтрации на сервер. Он ожидает, что сервер вернет весь список вопросов и выполнит фильтрацию на стороне клиента.

Я предполагаю, что для выполнения этой работы мне нужно подклассы Collection и переопределить метод fetch, чтобы вместо того, чтобы всегда получать данные с одного и того же URL-адреса RESTful, он передает вышеуказанные параметры.

Я не хочу изобретать велосипед. Мне не хватает функции в Backbone, которая упростит или упростит этот процесс с существующими компонентами? Есть ли уже устоявшийся образец для решения этой проблемы?

Answer 1

Если вы просто хотите передать параметры GET по запросу, вы должны просто указать их в самом вызове выборки.

collection.fetch({ 
    data: { 
    sortDir: "ASC", 
    totalResults: 100 
    } 
}); 

Варианты прошли в выборку должны непосредственно перевести на jQuery.ajax вызов, и свойство данные должны автоматически получить разобран. Конечно, переопределение метода выборки тоже хорошо, особенно если вы хотите стандартизировать части логики.

Answer 2

Вы правы, создание вашего собственного Collection - это путь, так как нет стандартов о разбиении страниц на страницы, кроме OData.

Вместо того, чтобы переопределять «выборку», то, что я обычно делаю в этих случаях, создает свойство collection.url как функцию, возвращает правильный URL на основе состояния коллекции.

Для того, чтобы сделать разбиение на страницы, сервер должен вернуть вам общее количество элементов, чтобы вы могли рассчитать, сколько страниц основано на элементах X на странице. В настоящее время некоторые API-интерфейсы используют такие вещи, как HAL или HATEOAS, которые в основном являются заголовками ответов HTTP. Чтобы получить эту информацию, я обычно добавляю слушателя к событию sync, которое возникает после любой операции AJAX. Если вам необходимо уведомить внешние компоненты (как правило, представление) о числе доступных элементов/страниц, используйте событие.

Простой пример: ваш сервер возвращает X-ItemTotalCount в заголовках ответов и ожидает, что в запросе будут запрашиваться параметры page и items.

var PagedCollection = Backbone.Collection.extend({ 
    initialize: function(models,options){ 
    this.listenTo(this, "sync", this._parseHeaders); 
    this.currentPage = 0; 
    this.pageSize = 10; 
    this.itemCount = 0; 
    }, 
    url: function() { 
    return this.baseUrl + "?page=" + this.currentPage + "&items=" + this.pageSize; 
    }, 
    _parseHeaders: function(collection,response){ 
    var totalItems = response.xhr.getResponseHeader("X-ItemTotalCount"); 
    if(totalItems){ 
     this.itemCount = parseInt(totalItems); 
     //trigger an event with arguments (collection, totalItems) 
     this.trigger("pages:itemcount", this, this.itemCount); 
    } 
    } 
}); 

var PostCollection = PagedCollection.extend({ 
    baseUrl: "/posts" 
}); 

Заметьте, что мы используем другую собственность, baseUrl упростить расширение PagedCollection. Если вам нужно добавить свой собственный initialize, вызовите родителя прототип один такой, или вы не разбирает заголовки:

PagedCollection.protoype.initialize.apply(this,arguments)

Вы даже можете добавить fetchNext и fetchPrevious методы сбора, где вы просто изменить this.currentPage и fetch. Не забудьте добавить {reset:true} как fetch, если вы хотите заменить одну страницу другой, а не добавлять.

Теперь, если ваш сервер для проекта согласован, любой ресурс, который позволяет разбивать страницы на сервер, может быть представлен с использованием одной коллекции на основе PagedCollection на клиенте, учитывая те же параметры/ответы.