Question

如何访问与模型对象相关的View元素？

例如，我有一个Products的集合。每种产品都有color属性。我想“隐藏”（即删除查看代表）每个color等于"red"的商品。

到目前为止，我所知道的唯一方法是通过调用模型对象的{for 1}} destroy()方法（下面的代码）。但我不想破坏Model的对象。是否可以在不更改其模型的情况下删除View的元素？

// App
hide_red_products: function() { 
  Product.each(function(x) {
    if (x.attributes.color == "red") { x.destroy() }
  })
}


// Products' view
initialize: function() {
  this.model.bind('destroy', this.remove_element, this);
}

remove_element: function() {
  return $(this.el).remove();
}

Answer 1

模型不应该控制视图的作用。

您应该使用trigger方法触发事件。假设颜色从某种颜色变为红色，则应使用change事件。如果您收听更改事件，则甚至不需要hide_red_products方法。

// App
hide_red_products: function() { 
  Product.each(function(x) {

    //if (x.attributes.color == "red") { x.trigger() }
    // you should never access a models attributes using the attributes key
    if (x.get('color') === 'red') { x.trigger('change'); } // shouldn't actually need this.
  })
}


// Products' view
initialize: function() {
  //this.model.bind('destroy', this.remove_element, this);
  this.model.bind('change', this.remove_element, this);
}

remove_element: function(model) {
  if (model.get('color') === 'red') {
     $(this.el).remove();
  }
}

就像我之前说的那样，如果视图侦听更改事件，则不必调用方法来删除元素。如果您认为有必要，可以使用change或自定义事件x.trigger('changedToRed');

自行触发

在Backbone.js中访问模型的视图

1 个答案: