Фильтрация коллекции не работает

Question

У меня есть коллекция моделей с булевым значением interviewed, и я хочу отфильтровать их так, чтобы в моем представлении отображались либо модели с этим свойством: true или модели с этим свойством, установленным на false. В моей коллекции у меня есть следующие методы:

var ResumeCollection = Backbone.Collection.extend({ 
    filterActive: function() { 
     var active = this.where({interviewed: false}); 
     return active; 
    }, 

    filterInterviewed: function() { 
     var interviewed = this.where({interviewed: true}); 
     return interviewed; 
    } 
}); 

и на мой взгляд, у меня есть следующие:

var ResumeList = Backbone.View.extend({ 
    events: { 
     'click #active': 'showActive', 
     'click #interviewed': 'showInterviewed' 
    }, 

    initialize: function() { 
     this.collection = new ResumeCollection(); 
    }, 

    render: function() { 
     var self = this; 
     this.$el.html($('#filter')); 
     _.each(this.collection.toArray(), function (cv) { 
      self.$el.append((new ResumeView({model: cv})).render().$el); 
     }); 
    }, 

    showActive: function() { 
     this.collection.filterActive(); 
     this.render(); 
    }, 

    showInterviewed: function() { 
     this.collection.filterInterviewed(); 
     this.render(); 
    } 
}); 

Но когда я нажимаю #active или #interviewed кнопки, то ничего не происходит и модели с требуемыми свойства не отображаются. Я уже пытался управлять этим методом reset или возвращать новый экземпляр коллекции с требуемыми моделями, но это не решение, потому что когда я успешно фильтрую исходную коллекцию, она возвращает мне новую коллекцию с моделями, которые мне нужны (например, модели где interviewed: true), и я не могу отфильтровать его больше - он возвращает только пустую коллекцию. Я просто не могу понять, как я могу отфильтровать эту коллекцию так, как мне нужно.

Answer 1

Вы возвращающая успешно отфильтрованную коллекцию, а затем с ними ничего не делает.

showActive: function() { 
    this.collection.filterActive();//returns a value you're not using 
    this.render(); 
}, 

showInterviewed: function() { 
    this.collection.filterInterviewed();//returns a value you're not using 
    this.render(); 
} 

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

Заимствование некоторых из кода Симо, чтобы вернуть новую коллекцию.

filterActive: function() { 
    var active = this.where({interviewed: false}); 
    return new ResumeCollection(active); 
}, 

filterInterviewed: function() { 
    var interviewed = this.where({interviewed: true}); 
    return new ResumeCollection(interviewed); 
}, 

render: function (filtered) { 
    var self = this; 
    var data = filtered ? filtered.toArray() : this.collection.toArray(); 
    this.$el.html($('#filter')); 
    _.each(data , function (cv) { 
     self.$el.append((new ResumeView({model: cv})).render().$el); 
    }); 
}, 

showActive: function() { 
    var filtered = this.collection.filterActive(); 
    this.render(filtered); 
}, 

showInterviewed: function() { 
    var filtered = this.collection.filterInterviewed(); 
    this.render(filtered); 
} 

Answer 2

Ваша проблема в том, что вы не возвращаете отфильтрованную коллекцию.

Это должно работать:

filterActive: function() { 
    var active = this.filter(function(item) { 
     return item.get('interviewed') === false; 
    }); 

    return new ResumeCollection(active); 
}, 

filterInterviewed: function() { 
    var interviewed = this.filter(function(item) { 
     return item.get('interviewed') === true; 
    }); 

    return new ResumeCollection(interviewed); 
}, 

Answer 3

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

Теперь при визуализации полной коллекции вы можете назвать, как делают

render(this.collection.models) // reference to list of models 

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

this.render(this.showActive()) // showActive returns subset of models from collection 

Таким образом рендеринге функция становится модульным .. которая принимает массив и сделать затем на странице ..

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