在 Backbone.Marionette 上更新多个模型

Updating multiple models on Backbone.Marionette

使用 Marionette 和 Coffeescript。

我正在努力让用户在视图模型上选中一个框,然后更改所有选中模型上的一个属性(例如,就像您在 Gmail 中所做的那样)。

现在我正计划将复选框的 ID 设置为模型的 ID,并使用 jQuery 获取所有选中框的 ID,并一次更新一个模型,可能是通过一个函数在接收 ID 数组和要更改的属性的 collection 上。

我的问题是:这样做有没有特别巧妙的 'Backbone way'?或者有什么建议吗?原谅我的笼统,我不太了解 backbone 方式,我的 google 搜索结果并不多。

编辑

所以我最终像下面那样做了。我在 checks/unchecks 所有复选框的视图上也有一个 selectAll 和 deselectAll 。我没有更新模型以反映选中或未选中,因为这似乎是不必要的,因为选中状态由于任何原因都没有保留,而且似乎在 selectAll 或 deselectAll 上大规模更新模型是不必要的工作。复选框的 ID 是该视图的模型 ID。

collection:

class MyCollection extends Backbone.Collection
  model: MyModel
....
  batchSave: (ids, attrs) ->
    for id in ids
      @get(id).save attrs, patch: true

可见:

class MyComposite extends Marionette.CompositeView
  events:
    'click .batch-attribute a' : 'attributeSelected'

  prioritySelected: (e) ->
    e.preventDefault()
    ids = $('.edit-select:checked').map( -> @id ).get()
    attr = {attr: e.currentTarget.dataset.value}
    @collection.batchSave ids, attr

理想情况下,您将拥有一个集合视图和一堆项目视图,如下所示:

var Checks = Backbone.Collection.extend({});
var checks = new Checks([{}, {}, {}]);
var CheckView = Backbone.View.extend({
  initialize: function() {
    this.render();
  },
  events: {
    'click input': 'check'
  },
  render: function() {
    this.$el.append('<input type="checkbox">').appendTo('body');
  },
  check: function(event) {
    this.model.set('selected ', $(event.target).is(':checked'));
  }
});
checks.each(function(model) {
  new CheckView({
    model: model
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.2.3/backbone-min.js"></script>

每个项目视图负责将其模型标记为已选中。稍后您可以简单地从集合视图中找到所选模型,例如 this.collection.where({selected:true});