Как правильно удалить область директивы из контроллера в AngularJS 1.2 - PullRequest
Новая
       42

Как правильно удалить область директивы из контроллера в AngularJS 1.2

0 голосов
/ 29 января 2019

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

Вот мой урезанный HTML: 

<div ng-controller="MyCtrl">
  <div class="directive-text" ng-style="style('green')" my-directive>This is my directive</div>
  <a ng-click="delete()">[ delete ]</a>
</div>

И мой JS: 

var demo = angular.module('demo', []);

demo.directive('myDirective', function() {
  return {
    link: function($scope, $element) {
      console.log('init directive');
    }
  }
});

demo.controller("MyCtrl", ['$scope', '$compile', function($scope, $compile) {
 $scope.items = {
    'red': {
      style: {
        color: 'red'
      }
    },
    'green': {
      style: {
        color: 'green'
      }
    }
  };

  $scope.style = function(color) {
    return $scope.items[color].style;
  }

  $scope.delete = function() {
    console.log('deleting...');
    $('.directive-text').remove();
    delete $scope.items['green'];
  };
}]);

Вот плункер: http://plnkr.co/edit/Rfp93aTucdivy0zguJaF

1 Ответ

0 голосов
/ 30 января 2019

Поиск в SO «директивы углового удаления из DOM» дал мне следующее: Angularjs удаляет пользовательские директивы и дочерние директивы из DOM

Краткая версия: Вы должны уничтожить область действиядиректива перед удалением из DOM. 

$scope.delete = function() {
  console.log('deleting...');
  // Destroy the directive's scope
  angular.element(document.querySelector(".directive-text")).scope().$destroy();
  // I changed the following line to avoid using jQuery
  angular.element(document.querySelector(".directive-text")).remove();
  delete $scope.items['green'];
};
...