Question

我的设置类似于此处http://ify.io/lazy-loading-in-angularjs/中的帖子，用于处理在Angular中延迟加载我应用的各种组件。

我遇到的问题是，加载的组件越多，应用程序的内存占用量就越大（显而易见，我知道）。是否有一种干净的方法来“卸载”或“破坏”已经延迟加载的角度服务/控制器/指令/等？

简单示例（供参考）

app.js

var app = angular.module('parentApp', ['ui.router']).config(function ($stateProvider, $urlRouterProvider, $controllerProvider, $compileProvider, $filterProvider, $provide) {

        var app = angular.module('app', ['ui.router'])
            .config(function ($stateProvider, $urlRouterProvider, $controllerProvider, $compileProvider, $filterProvider, $provide) {

                app.lazy = {
                    controller: $controllerProvider.register,
                    directive: $compileProvider.directive,
                    filter: $filterProvider.register,
                    factory: $provide.factory,
                    service: $provide.service
                };

                $urlRouterProvider.otherwise('/home');
                $stateProvider
                    .state('home', {
                        url: '/home',
                        templateUrl: 'views/main.html',
                        controller: 'MainCtrl'
                    })
                    .state('lazyLoad', {
                        url: '/lazyLoad',
                        templateUrl: 'views/lazyLoad.html',
                        controller: 'lazyLoadCtrl',
                        resolve: {
                            promiseObj: function ($q, $rootScope) {
                                var deferred = $q.defer();
                                var dependencies = [
                                    'scripts/controllers/lazyLoad.js'
                                ];

                                $script(dependencies, function () {
                                    $rootScope.$apply(function () {
                                        deferred.resolve();
                                    });
                                });

                                return deferred.promise;
                            }
                        }
                    });
            });

和延迟加载的控制器lazyLoad.js

angular.module('app')
  .lazy.controller('lazyLoadCtrl', function($scope){
        $scope.greeting = 'hi there';
      }
);

如果用户导航到#/lazyLoad，应用程序将加载到控制器（和视图）中，以及它所需的其他内容。但是当用户离开#/lazyload时，我希望卸载/销毁所有以前加载的组件。

如何完全取消注册/销毁/卸载（不确定这里的正确动词是什么......）'lazyLoadCtrl'控制器。如上所述，理想情况下，我希望能够在不再需要时卸载延迟加载的控制器，指令，过滤器，工厂和服务。

谢谢！

Answer 1

也许你可以尝试调用范围。$ destroy（）

来自angularjs范围doc https://docs.angularjs.org/api/ng/type/$rootScope.Scope

$破坏（）; 从父作用域中删除当前作用域（及其所有子作用域）。删除意味着对$ digest（）的调用将不再传播到当前范围及其子节点。删除还意味着当前范围符合垃圾收集的条件。

$ destroy（）通常由诸如ngRepeat之类的指令用于管理循环的展开。

在范围被销毁之前，在此范围内广播$ destroy事件。应用程序代码可以注册$ destroy事件处理程序，使其有机会执行任何必要的清理。

请注意，在AngularJS中，还有一个$ destroy jQuery事件，可以在从DOM中删除元素之前清除DOM绑定。

卸载/销毁Angular延迟加载的组件

1 个答案: