AngularJs MemoryLeak jQuery

时间:2019-01-21 09:48:45

标签: javascript jquery angularjs memory-leaks

我想使用以下服务在angularjs页面上显示自定义html:

app.service('automaticFunctions', function ($timeout) {

this.init = function initAutomaticFunctions(scope, $elem, attrs) {
    switch (scope.content.type) {
        case 'list':
            ....
            break;  
        case 'scroll':
            ....
            break;
        case 'custom':

        function updateFrameContent() {
            var frame = $($elem).find(".customFrame")[0];

            if (scope.content.frameType === "url") {
                scope.content.ngHide.frameContent = true;
                scope.content.ngHide.frameUrl = false;
                frame.src = scope.content.frameUrl;
            }
            if (scope.content.frameType === "html") {
                scope.content.ngHide.frameUrl = true;
                scope.content.ngHide.frameContent = false;
                frame.onload = function () {
                    frame.contentWindow.document.write(scope.content.frameContent);
                    frame.onload = null;
                };
                frame.src = "";
                // frame = null;
            }
        }

            scope.$watchGroup(['content.frameType', 'content.frameContent', 'content.frameUrl'], function () {
                updateFrameContent();
            });
            updateFrameContent();
            break;
    }

}
});

当我在页面之间进行路由时,我会从指令中调用初始化过程10到20次。

我有大量的内存泄漏,并且我不知道处理frame变量。如果将其设置为null,则不会发生内存泄漏,但是不会显示内容。

1 个答案:

答案 0 :(得分:0)

  

我有大量的内存泄漏,并且我不知道处理frame变量。如果将其设置为null,则不会发生内存泄漏,但不会显示内容。

使用$destroy事件释放frame对象:

    function updateFrameContent() {
        var frame = $($elem).find(".customFrame")[0];

        scope.$on("$destroy", function() {
            frame = null;
        });

        if (scope.content.frameType === "url") {
            scope.content.ngHide.frameContent = true;
            scope.content.ngHide.frameUrl = false;
            frame.src = scope.content.frameUrl;
        }

在AngularJS框架中,伪指令ng-repeatng-ifng-view等会创建和销毁DOM元素和子作用域。使用$destroy事件可包含所需的所有拆卸代码。

有关信息,请参见AngularJS $scope API Reference - Events