我有一个添加到表单中的指令，我需要知道表单何时从 DOM 中删除。我尝试使用 $destroy 事件来检测它，但是当我在元素上调用 .remove() 时，不会触发 $destroy 事件。
我这样做错了吗？有没有正确的方法来判断它何时从 DOM 中删除？
相关代码:
HTML:
<form id="myform" form-watch>
在 Controller 中:
var form = document.getElementById('myform');
// DOES NOT trigger $destroy
form.remove();
// DOES trigger $destroy
//angular.element(form).scope().$destroy();
指令:
app.directive('formWatch', function () {
return {
restrict: 'A',
link: function(scope, element) {
scope.$on('$destroy', function() {
alert('destroyed');
});
}
};
});
这是一个plunker
编辑:这是我正在使用的内容的更准确的图片:new plunker
最佳答案
我不太确定您真正关心的是实际的销毁事件本身，而是应用程序中了解表单何时存在或不存在的一种方式。
这应该通过应用程序中的 Controller 和服务进行监控。
我认为问题是存在不应该存在的 dom 操作...通过使用适当的范围模型并设计仅由范围模型驱动的 View ，Angular 应该完成几乎所有的 dom 操作，如果不是全部的话。
以下示例通过将表单包装在其自己的 Controller 中并使用 ng-if 和作用域变量来确定表单是否存在来实现您想要的警报:
app.controller('MainCtrl', function($scope) {
$scope.showForm = true;
});
app.controller('FormCtrl', function($scope) {
$scope.$on('$destroy', function() {
alert('destroyed');
});
});
HTML:
<body ng-controller="MainCtrl">
<!-- form has it's own controller -->
<form ng-if="showForm" ng-controller="FormCtrl"></form>
<!-- button in MainCtrl scope -->
<button ng-click="showForm = !showForm">Toggle form</button>
每当表单被 ng-if 删除时，FormCtrl 作用域就会被销毁，并且 $destroy 事件就会被触发。然而，观察决定表单存在的作用域变量可能正是您真正想要的
关于javascript - 从 DOM 中删除元素时，不会调用 $destroy，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31564936/