如何卸载angularjs模块 [英] How to unload angularjs modules

问题描述

我有一个由N个模块的应用程序。几乎所有这些模块将按需加载。

I have an application that consists of N Modules. Almost all of those modules will be loaded on demand.

有没有组织AngularJS应用与动态加载和卸载模块的任何好办法？

Is there any good way to organize AngularJS application with dynamically loaded and unloaded modules?

• 模块（N）的数量可以尽可能的和我不能保证其中任何最大值。所以我尽量避免过度使用内存;


• 我不认为这是离开里面，我们不打算使用的浏览器code（我不喜欢这个想法，我的web应用程序选项卡将消耗所有可用内存，并会挂的最佳实践浏览器）;


• 我认为谷歌过于往那个方向。您可以与您的Gmail整个白天工作，它仍然正常运行（谷歌I / O 2013 - 一趟下来内存里与Gmail和DevTools 的<一个href=\"http://www.youtube.com/watch?v=x9Jlu_h_Lyw\">http://www.youtube.com/watch?v=x9Jlu_h_Lyw).

• Number of Modules (N) can be as much as possible and I can't guarantee any maximum number of them. So I try to avoid excessive use of the memory;
• I don't think it is the best practice to leave the code inside browser that we not going to use (I don't like the idea that tab with my webapp will consume all available memory and will hangs the browser);
• I think Google is too going that way. You can work with your Gmail whole the day and it's still running properly (Google I/O 2013 - A Trip Down Memory Lane with Gmail and DevTools http://www.youtube.com/watch?v=x9Jlu_h_Lyw).

• 嵌套模块在AngularJS

• the Nested Modules in AngularJS

推荐答案

由于角1.2.16和1.3.0测试版，在引导（）方法的定义了DOM的根范围为模块集合的特定元素。还有就是要解除没有相应的方法。在 NG-应用指令是只是一个快捷键引导（） ，所以同样的限制适用。

As of Angular 1.2.16 and 1.3.0 beta, the bootstrap() method defines a specific element on the DOM as the root scope for a collection of modules. There is no corresponding method to unbind. The ng-app directive is just a shortcut for bootstrap(), so the same limitation applies.

该角requirejs种子项目阿蒂米斯挂不回答你的问题。它使用 NG_DEFER_BOOTSTRAP！属性的暂停引导过程并动态定义哪些模块在页面加载时间增加。它不会卸载任何东西。

The angular-requirejs-seed project Artemis linked to does not answer your question. It uses the NG_DEFER_BOOTSTRAP! property to suspend the bootstrap process and dynamically define which modules to add at the time the page is loaded. It does not unload anything.

克服角固有无法卸载模块，最简单的方法是摧毁那里的模块正在运行的DOM元素。不幸的是，通过破坏元素，你也失去了你有任何标记。一种解决这一问题是把你的应用程序的标记成HTML5 ＆LT;模板＆GT; 元素和克隆的内容。这里是我JSBin写凡含糊名为<$ C $为例C> someGuyInASuit 指令加载取决于化身博士或海德先生的照片，其上加载的模块。

The most straightforward way to overcome Angular’s inherent inability to unload modules is to destroy the DOM element where your modules are running. Unfortunately, by destroying the element, you also lose whatever markup you had. One solution to that problem is to put your app’s markup into an HTML5 <template> element and clone its contents. Here’s an example I wrote in JSBin where an ambiguously named someGuyInASuit directive loads a picture of Dr. Jekyll or Mr. Hyde depending on which module is loaded.

这个解决办法是不适合由许多模块的应用，特别是如果你打算交换他们在进出频繁的用户与之互动。其一，所有的车型都将被破坏。此外，所有的配置（）和的run（）块将被重新运行。你可能想要么叉角并添加自己的非引导方法或看看另一个框架，如反应，它具有的为卸载组件的方法的内置的。

This work-around is not well suited to an app consisting of many modules, especially if you intend to swap them in and out frequently as the user interacts with it. For one, all your models will be destroyed. Also, all the config() and run() blocks will be re-run. You may want to either fork Angular and add your own un-bootstrap method or have a look at another framework such as React, which has a method for unloading components built in.

这篇关于如何卸载angularjs模块的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！