從集合中獲取下一個和以前的模型

Question

我已經看到了幾種不同的方式從集合中獲取下一個或以前的模型，但想知道是否有人可以提供一些建議，以便我決定實施它。我的收藏是有序的，但我排序的ID不保證是連續的。它只保證是唯一的。假設較小的ID是集合的「較舊」條目，較大的ID是「較新」。

MyCollection = Backbone.Collection.extend({ 
    model: MyModel, 
    initialize:function(){ 
    this.getElement = this._getElement(0); 
    }, 
    comparator: function(model) { 
    return model.get("id"); 
    }, 
    _getElement: function (index){ 
    var self = this; 
    return function (what){ 
    if (what === "next"){ 
     if (index+1 >= self.length) return null; 
     return self.at(++index); 
    } 
    if (what === "prev"){ 
     if (index-1 < 0) return null; 
     return self.at(--index); 
    } 
    // what doesn't equal anything useful 
    return null; 
    }; 
    } 
}); 

當使用getElement，我不喜歡的東西getElement（「下一步」）而getElement（「上一頁」），要求我的集合中的一個或下一個模型。從getElement返回的是實際模型，而不是索引。我知道關於collection.indexOf，但我想要一種方式來循環一個集合，而不需要先創建一個模型。這個實現比它需要的更難嗎？

Answer 1

我會做這樣的事情。請記住，目前沒有任何錯誤處理，所以如果您當前處於集合中的第一個模型，並嘗試獲取之前的錯誤，您可能會遇到錯誤。

MyCollection = Backbone.Collection.extend({ 
    model: MyModel, 
    initialize:function(){ 
    this.bindAll(this); 
    this.setElement(this.at(0)); 
    }, 
    comparator: function(model) { 
    return model.get("id"); 
    }, 
    getElement: function() { 
    return this.currentElement; 
    }, 
    setElement: function(model) { 
    this.currentElement = model; 
    }, 
    next: function(){ 
    this.setElement(this.at(this.indexOf(this.getElement()) + 1)); 
    return this; 
    }, 
    prev: function() { 
    this.setElement(this.at(this.indexOf(this.getElement()) - 1)); 
    return this; 
    } 
}); 

要前進到下一個模型collection.next()。前進到下一個模型並返回它var m = collection.next().getElement();

更好地解釋next/prev如何工作。

// The current model 
this.getElement(); 
// Index of the current model in the collection 
this.indexOf(this.getElement()) 
// Get the model either one before or one after where the current model is in the collection 
this.at(this.indexOf(this.getElement()) + 1) 
// Set the new model as the current model 
this.setElement(this.at(this.indexOf(this.getElement()) + 1)); 

Answer 2

我這樣做的方式稍有不同，因爲我將方法添加到模型而不是集合中。這樣，我可以抓住任何模型，並獲得序列中的下一個模型。

next: function() { 
    if (this.collection) { 
     return this.collection.at(this.collection.indexOf(this) + 1); 
    } 
}, 
prev: function() { 
    if (this.collection) { 
     return this.collection.at(this.collection.indexOf(this) - 1); 
    } 
}, 

Answer 3

碰碰這個古老的線程有一個較爲通用的解決方案：

東西添加到Collection.prototype

current: null, 

initialize: function(){ 
    this.setCurrent(0); 
    // whatever else you want to do here... 
}, 

setCurrent: function(index){ 
    // ensure the requested index exists 
    if (index > -1 && index < this.size()) 
     this.current = this.at(index); 
    else 
     // handle error... 
}, 

// unnecessary, but if you want sugar... 
prev: function() { 
    this.setCurrent(this.at(this.current) -1); 
}, 
next: function() { 
    this.setCurrent(this.at(this.current) +1); 
} 

那麼你可以使用糖的方法來獲得分組/下一個型號像這樣...

collection.prev(); 
collection.next(); 

Answer 4

My Backbo ne SelectableCollection類：

Backbone.Collection.extend({ 
    selectNext: function() { 
     if(this.cursor < this.length - 1) { 
      this.cursor++; 
      this.selected = this.at(this.cursor); 
      this.trigger('selected', this.selected); 
     } 
    }, 

    selectPrevious: function() { 
     if(this.cursor > 0) { 
      this.cursor--; 
      this.selected = this.at(this.cursor); 
      this.trigger('selected', this.selected); 
     } 
    }, 
    selectById: function (id) { 
     this.selected = this.get(id); 
     this.cursor = this.indexOf(this.selected); 
     this.trigger('selected', this.selected); 
    }, 
    unselect: function() { 
     this.cursor = null; 
     this.selected = null; 
     this.trigger('selected', null); 
    } 
});