2015-07-04 3 views
0

У меня есть директива, которая выглядит следующим образом:Как удалить угловой наблюдатель из элемента управления?

app.directive('mydirective', function($compile,$document){ 
    var directive = { 
     restrict: 'EA', 
     scope:{ 
     }, 
     link: link, 
    }; 
    return directive; 

    function link(scope, element, attr) { 
     var template_html = "<div id=\"popup\">{{popupTitle}}</div>"; 
     var template = angular.element(template_html); 

     element.bind('click', function(){ 
       if(!$("#popup").is(':visible')){ 
        var $popup = $compile(template)(scope); 
        $document.find('body').append($popup); 
       }else{ 
        $("#popup").remove(); 
       } 
      }); 

     template.remove(); 

    } 
}); 

код работает отлично показывает и удаления всплывающего элемента при нажатии на mydirective. Но проблема возникает каждый раз, когда элемент показывает & hide, угловой наблюдатель просто продолжает увеличиваться. Количество увеличения наблюдателя зависит от количества привязок в template_html.

Как я могу удалить этих наблюдателей при удалении всплывающего окна, чтобы наблюдатели не накапливали увеличение с течением времени.

ответ

1

Вы пытались уничтожить область внутри блока else, когда всплывающее окно удаляется?

element.bind('click', function(){ 
     if(!$("#popup").is(':visible')){ 
      var $popup = $compile(template)(scope); 
      $document.find('body').append($popup); 
     }else{ 
      $("#popup").remove(); 
      scope.$destroy(); 
     } 
    }); 

Чтобы создать новую область вы могли бы сделать что-то вроде

var popupScope; 
element.bind('click', function(){ 
    if(!$("#popup").is(':visible')){ 
     popupScope = $scope.$new(); 
     var $popup = $compile(template)(popupScope); 
     $document.find('body').append($popup); 
    }else{ 
     $("#popup").remove(); 
     popupScope.$destory(); 
    } 
}); 
+0

Спасибо за ваш ответ. Но 'scope. $ Destroy();' уничтожить все. При повторном отображении привязки не будут работать снова. – user1995781

+0

Ahh hrmm, что было бы проблемой. Можете ли вы создать новую область для своего всплывающего окна, а затем уничтожить эту область, когда всплывающее окно закрывается? – noveyak

+0

Можете ли вы показать пример моего понимания того, как это можно сделать? Благодарю. – user1995781

0

магазина вашего watcher в контроллере в качестве переменного:

var myWatcher = $scope.$watch(...... 

И убедитесь, что ваш контроллер доступен из Ваших директиву, то вы можете позвонить myWatcher(), который отвяжет ваш наблюдатель, так как вызов watch вернет несвязанную функцию.