¿La mejor manera de hacer que un modelo sea "seleccionado" en una colección Backbone.js?

Question

Tengo una colección de modelos en mi aplicación Backbone.js.

Es una lista de elementos sobre los que puede pasar el mouse o navegar con el teclado.

Si el mouse está en el aire, o si la navegación del teclado tiene el elemento seleccionado, ambos harán lo mismo: establecer ese elemento/modelo particular para ser 'seleccionado'.

Así que en mi modelo, tengo un atributo básicamente llama

selected: false 

Cuando se cernía sobre, o se selecciona con el teclado, esto entonces será

selected: true 

Pero, ¿cuál es la mejor forma de garantizar que cuando este modelo es cierto, los otros son todos falsos?

Actualmente estoy haciendo algo básico de ciclismo a través de cada modelo en la colección y luego establezco el modelo seleccionado para que sea verdadero. Pero me pregunto si hay una forma mejor y más eficiente de hacer esto.

Answer 1

Ser seleccionado parece una responsabilidad fuera del alcance de un modelo. La noción de seleccionado implica que hay otros, pero un modelo solo puede preocuparse por sí mismo. Como tal, consideraría trasladar esta responsabilidad a otra parte donde la noción de muchos modelos y tener uno seleccionado parece más natural y esperado.

Considere la posibilidad de asignar esta responsabilidad a la colección como asociación. Por lo tanto, this.selected apuntaría al modelo seleccionado. Y luego puede agregar un método para devolver el modelo seleccionado en una colección.

Como alternativa, podría otorgar esta responsabilidad a la vista. Puede hacer esto si la selección de un modelo es puramente una preocupación en la capa de Vista.

El subproducto de eliminar la responsabilidad del modelo es que elimina la necesidad de recorrer toda la colección cuando se selecciona un nuevo modelo.

Answer 2

Hice algo como el Sr. Eisenhauer sugirió. Yo también quería el concepto de datos paginados. Realmente no quería mezclar el número de página seleccionado, etc. en la colección en sí, así que creé un "modelo" para los datos de la tabla y lo llamé una instantánea. Algo como esto:

JobSummary = Backbone.Model.extend({}); 

JobSummaryList = Backbone.Collection.extend({ 
    model: JobSummary 
}; 

JobSummarySnapshot = Backbone.Model.Extend({ 
    defaults: { 
    pageNumber: 1, 
    totalPages: 1, 
    itemsPerPage: 20, 
    selectedItems: new JobSummaryList(), // for multiple selections 
    jobSummaryList: new JobSummaryList() 
    } 
}); 

Answer 3

Así es como lo estoy haciendo. La colección almacena una referencia al modelo seleccionado, pero el estado se mantiene en el modelo. Esto podría adaptarse para permitir un algoritmo más complejo para elegir qué modelos se seleccionan.

JobSummary = Backbone.Model.extend({ 

    setSelected:function() { 
    this.collection.setSelected(this); 
    } 

}); 

JobSummaryList = Backbone.Collection.extend({ 
    model: JobSummary, 

    initialize: function() { 
    this.selected = null; 
    }, 

    setSelected: function(jobSummary) { 
    if (this.selected) { 
     this.selected.set({selected:false}); 
    } 
    jobSummary.set({selected:true}); 
    this.selected = jobSummary; 
    } 
}; 

Answer 4

Salida Backbone.CollectionView, que incluye soporte para la selección de modelos cuando se hace clic fuera de la caja. El caso de desplazamiento que podría implementar con el método setSelectedModel.

Answer 5

Es posible que desee echar un vistazo a dos componentes de la mina:

• Backbone.Select
• Backbone.Cycle

Backbone.Select tiene un área de superficie mínima. Tan pocos métodos como sea posible se agregan a sus objetos. La idea es que puedas usar Backbone. Selecciona mixins en casi todos lados, con un riesgo de conflictos cercano a cero.

Backbone.Cycle está construido en la parte superior de Backbone.Seleccione. Agrega métodos de navegación y algunas campanas y silbatos más. Probablemente sea la mejor opción para un proyecto greenfield.