1

在我使用以下传单指令的地方，我的 Angular 应用程序中存在明显的内存泄漏： https ://github.com/tombatossals/angular-leaflet-directive 。

请注意，该指令工作正常，但是当我离开并返回使用该指令的任何视图时，内存占用量继续增长。

该指令基于此处找到的传单 JavaScript 库：https ://github.com/Leaflet/Leaflet

我使用指令如下：

<div ng-controller="Explore">
    <div leaflet defaults="defaults" center="center" markers="markers" layers="layers"></div>
</div>

在我的控制器中，我将传单指令属性扩展到范围：

    angular.extend($scope, {
    defaults: {
        dragging: true,
        doubleClickZoom: false,
        scrollWheelZoom: false,
        maxZoom: 12,
        minZoom: 12
    },
    center: {
        lat: $scope.cities[$scope.market.city][1],
        lng: $scope.cities[$scope.market.city][0],
        zoom: 12
    },
    markers: {},
    layers: {
        baselayers: {
            google: {
                name: 'Google Streets',
                layerType: 'ROADMAP',
                type: 'google'
            }
        }
    }
});

我不确定是什么导致了内存泄漏，但我相信这可能与在传单指令中调用 $destroy 时未删除的事件侦听器有关：

scope.$on('$destroy', function () {
    leafletData.unresolveMap(attrs.id);
});

在销毁函数 unresolveMap 被调用：

this.unresolveMap = function (scopeId) {
    var id = leafletHelpers.obtainEffectiveMapId(maps, scopeId);
    maps[id] = undefined;
};

这是我得到的。如果有人遇到过类似的事情或对如何进一步解决这个问题有任何想法，我将不胜感激:)

4

2 回答 2

0

您应该尝试通过在 on $destroy 处理程序中添加 map.remove() 来完全删除地图（从传单 API 中它应该：“销毁地图并清除所有相关的事件侦听器”）。

scope.$on('$destroy', function () {
        leafletData.unresolveMap(attrs.id);
        map.remove();
      });
于 2014-05-22T12:39:55.773 回答
0

您是否尝试为地图分配id属性？attrs.id指的就是这个。

<leaflet id="myMap" defaults="defaults" center="center" markers="markers" layers="layers"></leaflet>
于 2014-08-08T00:19:31.463 回答