當從指令中刪除元素時，AngularJs會自動銷毀范圍嗎？

Question

說我有指令：

angular.module('myApp').directive('myDirective', function ($compile) {
    return {
        link: function ($scope, $element, $attrs) {
            var $randomElem = $('<div>');
            $element.append($compile($randomElem)($scope));

            $randomElem.remove();
        }
    }
});

范圍會自動銷毀嗎？ 如果沒有，我怎么能摧毀它？

Answer 1

在您的情況下， $randomElem將與其父級（指令容器）具有相同的范圍。 所以它不會被破壞。

現在你要為這個元素創建一個新的范圍：

// Case 1: child scope sharing the properties with parent
$element.append($compile($randomElem)($scope.$new()));

// case 2: child scope isolated, no sharing with parent
$element.append($compile($randomElem)($scope.$new(true)));

然后，您需要在刪除元素時手動銷毀范圍。 對於你可以使用$scope.$destroy()

例如：

var newScope = $scope.$new();
$element.append($compile($randomElem)(newScope));


newScope.$destroy(); // or $randomElem.scope().$destroy();
$randomElem.remove();