Backbone.js的：如何从事件解除，型号删除 [英] Backbone.js: how to unbind from events, on model remove

问题描述

在骨干网，我们有一个使用事件聚合器的应用程序，位于 window.App.Events
现在，在许多的意见，我们绑定到该聚合器，和我在一个视图，它处理从解除绑定该事件聚合，然后删除该视图手动写了一个破坏作用。 （而不是直接删除视图）。

in backbone we have an app that uses an event Aggregator, located on the window.App.Events now, in many views, we bind to that aggregator, and i manually wrote a destroy function on a view, which handles unbinding from that event aggregator and then removing the view. (instead of directly removing the view).

现在，有我们需要这个功能，以及某些机型，但我无法弄清楚如何解决它。

now, there were certain models where we needed this functionality as well, but i can't figure out how to tackle it.

某些型号需要绑定某些事件，但也许我错了，但如果我们删除它保持在内存中集合的模式，由于这些绑定的事件聚合这是仍然存在。

certain models need to bind to certain events, but maybe i'm mistaken but if we delete a model from a collection it stays in memory due to these bindings to the event aggregator which are still in place.

有没有真正模型上删除功能，如一种观点。
所以我怎么会TACKE呢？

there isn't really a remove function on a model, like a view has. so how would i tacke this?

修改
根据要求，一些code的例子。

EDIT on request, some code example.

App = {
    Events: _.extend({}, Backbone.Events)
};

var User = Backbone.Model.extend({

    initialize: function(){
        _.bindAll(this, 'hide');
        App.Events.bind('burglar-enters-the-building', this.hide);
    },

    hide: function(burglarName){
        this.set({'isHidden': true});
        console.warn("%s is hiding... because %s entered the house", this.get('name'), burglarName);
    }

});

var Users = Backbone.Collection.extend({

    model: User

});

var House = Backbone.Model.extend({

    initialize: function(){
        this.set({'inhabitants': new Users()});
    },

    evacuate: function(){
        this.get('inhabitants').reset();
    }

});



$(function(){

    var myHouse = new House({});

    myHouse.get('inhabitants').reset([{id: 1, name: 'John'}, {id: 1, name: 'Jane'}]);

    console.log('currently living in the house: ', myHouse.get('inhabitants').toJSON());

    App.Events.trigger('burglar-enters-the-building', 'burglar1');

    myHouse.evacuate();

    console.log('currently living in the house: ', myHouse.get('inhabitants').toJSON());

    App.Events.trigger('burglar-enters-the-building', 'burglar2');

});​

在行动

查看此code上的jsfiddle（在控制台输出）： http://jsfiddle.net/saelfaer / szvFY / 1 /

你可以看到，我不绑定到模型中的事件，而是事件聚合器。
从模型本身解除绑定的事件，是没有必要的，因为如果它去掉没有人会再次触发它的事件。但eventAggregator总是在的地方，便于传递活动在整个应用程序。

as you can see, i don't bind to the events on the model, but to an event aggregator. unbinding events from the model itself, is not necessary because if it's removed nobody will ever trigger an event on it again. but the eventAggregator is always in place, for the ease of passing events through the entire app.

在code例子显示，即使当他们从集合中删除，他们没有住的房子了，但是当一个小偷进入屋内仍执行HIDE命令。

the code example shows, that even when they are removed from the collection, they don't live in the house anymore, but still execute the hide command when a burglar enters the house.

推荐答案

我看到，即使在结合事件的方向是这样的 Object1 - >收听 - > Object2的的它已被为了去除到的 Object1 的丢失的任何活着的参考。

I see that even when the binding event direction is this way Object1 -> listening -> Object2 it has to be removed in order to Object1 lost any alive reference.

和看到的，听示范删除事件不是一个解决方案，由于它不是在 Col​​lection.reset（）调用那么我们有两种解决方法：

And seeing that listening to the Model remove event is not a solution due it is not called in a Collection.reset() call then we have two solutions:

作为<一个href=\"http://stackoverflow.com/questions/7874339/backbone-js-does-calling-collection-reset-removes-the-models-as-well\">@dira这里最高审计机关你可以覆盖 Col​​lection._removeReference 来使该方法更适当的清洁。

As @dira sais here you can overwrite Collection._removeReference to make a more proper cleaning of the method.

我不为两个原因喜欢这样的解决方案：

I don't like this solutions for two reasons:

• 我不喜欢覆盖了超级后，调用方法。


• 我不喜欢覆盖私有方法

• I don't like to overwrite a method that has to call super after it.
• I don't like to overwrite private methods

至极是相反的。而不是添加的更深入的功能的，添加的上的功能的

Wich is the opposite: instead of adding deeper functionality, add upper functionality.

而不是调用然后 Col​​lection.reset（）直接可以调用的实施清理的之前已经悄悄地取下模型：

Then instead of calling Collection.reset() directly you can call an implementation that cleanUp the models before been silently removed:

cleanUp: function( data ){
  this.each( function( model ) { model.unlink(); } );
  this.reset( data );
} 

您code能的分选机的版本是这样的：

A sorter version of your code can looks like this:

AppEvents = {};
_.extend(AppEvents, Backbone.Events)

var User = Backbone.Model.extend({
  initialize: function(){
    AppEvents.on('my_event', this.listen, this);
  },

  listen: function(){
    console.log("%s still listening...", this.get('name'));
  },

  unlink: function(){
   AppEvents.off( null, null, this );
  }
});

var Users = Backbone.Collection.extend({
  model: User,

  cleanUp: function( data ){
    this.each( function( model ) { model.unlink(); } );
    this.reset( data );
  }
});


// testing
var users = new Users([{name: 'John'}]);
console.log('users.size: ', users.size()); // 1
AppEvents.trigger('my_event');             // John still listening...

users.cleanUp();
console.log('users.size: ', users.size()); // 0
AppEvents.trigger('my_event');             // (nothing)

的jsfiddle

Check the jsFiddle.

我们验证Object1听在Object2的一个事件的第一件事的方向创建一个链接的 Obect2 - > Object1 的：

First thing we verify that Object1 listening to an event in Object2 creates a link in the direction Obect2 -> Object1:

在我们看到的模型（@ 314019）上面的图片不仅是由用户集合，但也保留了 AppEvents 对象，该对象是观察。貌似的事件链接的一个程序员视角的是听对象 - >到 - >对象，它是听的，但实际上是完全相反的： Object，它是听 - >到 - >对象，它是听的

In the above image we see as the Model (@314019) is not only retained by the users collection but also for the AppEvents object which is observing. Looks like the event linking for a programmer perspective is Object that listen -> to -> Object that is listened but in fact is completely the opposite: Object that is listened -> to -> Object that is listening.

现在，如果我们使用 Col​​lection.reset（）清空，我们看到的用户集合链接有被删除，但 AppEvents 链接仍然是：

Now if we use the Collection.reset() to empty the Collection we see as the users link has been removed but the AppEvents link remains:

的用户链接已消失，还链接 OurModel.collection 我认为是部分 Col​​lection._removeReference（）工作

The users link has disappear and also the link OurModel.collection what I think is part of the Collection._removeReference() job.

当我们使用 Col​​lection.cleanUp（）方法的对象从内存中消失了，我不能让 Chrome.profile 工具明确告诉我的对象@ 314019已被删除的，但我可以看到，它不再内存对象之间

When we use our Collection.cleanUp() method the object disappear from the memory, I can't make the Chrome.profile tool to explicitly telling me the object @314019 has been removed but I can see that it is not anymore among the memory objects.

这篇关于Backbone.js的：如何从事件解除，型号删除的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！