is it necessary to include a destroy method in my directive

问题

I've written a pretty simple directive that adds/removes a css class on an element when the element is clicked.

app.directive('dropdown', function() {
    var open = false, element,

    callback = function(){
        open = !open;
        if (open) {
            element.addClass('open');
        } else {
            element.removeClass('open');
        }
    };

    return {
        scope: {},
        link: function(scope, elem){
            element = elem;
            elem.bind('click', callback);
            scope.$on('$destroy', function(){
                elem.unbind('click', callback);
                elem.remove();
            });
        }
    };
});

I think that the $destroy method is probably unnecessary. Since I've used the built in jqlite the listener will be destroyed along with the element right? Also is there any benefit to calling elem.remove(). I've seen it in some examples but not sure if I see the need.

Any thoughts appreciated

C

回答1:

You don't have to remove the element manually for sure. You also don't need to unbind anything from scope because it will be handled by angularjs itsef.

For jquery dom listeners:

In case you are referencing JQuery then angular will use it instead of his internal jqLite implementation. It means that the native jquery remove method will be used for the element removal. And the jquery documentation for remove says:

Similar to .empty(), the .remove() method takes elements out of the DOM. Use .remove() when you want to remove the element itself, as well as everything inside it. In addition to the elements themselves, all bound events and jQuery data associated with the elements are removed.

So i think that you don't need to unbind your listeners.

But I'm not 100% sure about this:)

回答2:

In your case, you should be fine since the event is bound to the element that gets removed and thus the handler gets destroyed along with the element itself. Now, if your directive binds an event to a parent outside of its own DOM element, then that would need to be removed manually on the $destroy.

However, closure can cause any object to stay alive so that's something you do need to worry about. You could introduce a new function still referencing variable objects in the functions whose scope you are trying to destroy and that prevents GC from doing what you likely want it to. Again, that won't affect your current example, but it's something to always consider.

来源：https://stackoverflow.com/questions/25934575/is-it-necessary-to-include-a-destroy-method-in-my-directive