javascript - Angular .js : using events to trigger actions in controllers might cause memory leak

Question

我的申请结构如下: - 带有搜索框和按钮的静态标题 - 标题中的菜单，可在 View 之间切换 - 在此之下，一个带有 ng-view 的 div； View 通过 routeProvider 打开菜单点击

当用户单击标题中的搜索按钮时，所有 View Controller (通过 routeProvider 分配)应该从共享服务加载一些数据。我使用事件实现了这个。在我的搜索表单 Controller 中:

$scope.search = function () {
        DataStore.load($scope.searchFormState.someSearchParam, $scope.searchFormState.anotherSearchParam);
        $scope.$emit('searchForm:search');
    }

在我的 Controller 中，我监听该事件并加载一些数据:

$scope.systemListener = $rootScope.$on('searchForm:search', function () {
        DataStore.promises.somePromise.then(function () {
            $scope.myDataArray = DataStore.data.dataArrayFromService;
        });
    });

然后，在我的 Controller 中，我监听销毁事件:

    $scope.$on('$destroy', function () {
        $scope.systemListener();
    });

一切正常，但是当我在菜单中四处点击时，我注意到我的 js 堆增长很快。我怀疑某处存在内存泄漏。这可能与我的 Controller 的范围没有被正确地垃圾收集有关吗？我需要在我的析构函数中做任何其他事情吗？

Answer 1

如果您的 Controller 中有任何观察者，您可能希望在 $destroy 监听器中取消观察它们。 喜欢`

var $unwatch = scope.$watch(something, somethingElse);

$scope.$on('$destroy', function () {
    $unwatch();
});

此外，我建议不要在代码中使用 $scope.$$listener = [];，至少因为 $$listener 是 angularjs 的局部变量，它的名称可能会随着即将推出的 angular 版本而改变。