2016-02-18 4 views
3

https://docs.angularjs.org/guide/directiveAngularJS очистки и утечки памяти

Слушатели прописали прицелы и элементы автоматически очищаются, когда они будут уничтожены, но если вы зарегистрировали слушатель на службе, или зарегистрирован прослушиватель на DOM , который не удаляется, вам придется самостоятельно его очистить или вы рискуете ввести утечку памяти.

Я не понимаю ни одной вещи (на самом деле я не понимаю много вещей об Угловом, но теперь я нацелен именно на это). Может кто-нибудь объяснить разницу между зарегистрированных до областей и элементов» и „зарегистрирован прослушиватель на услугу, или зарегистрированный слушатель на DOM“. В чем разница между элементами и DOM в этом приговор. а почему в первом случае слушатели автоматически очищаются, но во втором их нет. Что регистрируется в элементы и то, что регистрируется на DOM?

ответ

3

Примечание мы говорим о двух слегка различные виды очистки здесь:

  1. Функции прослушивателя событий могут потребоваться для очистки.
  2. Созданные элементы также могут нуждаться в очистке.

В этих случаях Угловое чистит для вас:

// Watching scope vars 
$scope.$watch("scopeVariable", function (newVal) { ... }); 
$scope.$watch("injectedService.serviceVar", function (newVal) { ... }); 

// Listening to events from a scope 
$scope.$on("event", function() { ... }); 

// Events of the element of a directive, 
// within the directive 'link' function (the docs you referenced) 
element.on('click', function() { ... }); 

Во всех этих случаях нет необходимости делать какие-либо очистки. Angular знает, что какой-то код прослушивает события или просматривает переменные и может их отменить. Для элемента, так как он будет удален, все затворы и связанные объекты не будут устранены и, следовательно, позже будут утилизироваться сборщиком мусора.

С другой стороны, в следующих случаях: Угловой не будет делать очистку для вас:

// Listening to events from rootScope 
$rootScope.$on("event", function() { ... }); 

// Subscribing to services events 
someInjectedService.subscribeIncomingMessage(function() { ... }); 

// Adding elements outside directive container element 
var body = $document.find('body').eq(0); 
var newElement = angular.element('<div></div>'); 
body.append(newElement); 

// Listening to events of elements outside your directive (ie. body) 
body.on("click", function() { ... }); 

В этих случаях Угловой никогда не уничтожить ваши слушатель, ни созданный элемент, добавленный к <body> документу ,

В сырых словах, я бы сказал, Угловые просто уничтожить все внутри вашей области или , содержащейся в DOM вашего директивы корневого элемента. Все, что вы слушаете, или элементы, которые вы создаете и размещаете вне вашей директивы, - ваша ответственность.

Цитирование угловые документы, вы могли бы сделать очистку путем прослушивания разрушающих событий:

Best Practice: директивы должны убирать за собой. Вы можете использовать element.on('$destroy', ...) или scope.$on('$destroy', ...) для запуска функции очистки при при удалении директивы.

Я лично добавляю эти методы только тогда, когда есть что-то для очистки. Вам нужно сделать это специально, если вы создаете элементы реестра для внешних событий (т. Е. Сообщения, поступающие из веб-сокетов или запланированные события таймаута), иначе вы рискуете оказаться в нескольких прослушивателях для одного и того же события (как правило, вызывая неправильное поведение и медлительность).

Смежные вопросы