如何在AngularJS 1.2中正确地从控制器中删除指令范围

我试图通过一个控制器调用从页面中删除一个指令实例，并得到一些我似乎无法理解的摘要问题。看起来作用域没有得到正确的清理，并且在删除元素后仍然会激发evens。谢谢你的帮助

以下是我的精简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>

下面是一个例子：

继续搜索“来自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'];
};

$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'];
};