AngularJS:在控制器中动态注入服务或指令(不需要在angular.module's的方括号中预先包含它们
AngularJS: Inject service or directives dynamically in controller (without including them in angular.module's square brackets beforehand, see example)
我的AngularJS应用中有一些带有动态选项卡的页面。一个例子是一个帐户设置页面,它有一堆标签,如Profile
, Billing
, Password
等。这些选项卡是根据用户启用的模块动态地添加的。我使用ngRoute
在ng-view中加载选项卡内容。
请看下面的例子:
http://plnkr.co/edit/NIvMRw65VHMxZjTluKxQ?p =
预览代码不工作,因为我没有包括moduleOne
和moduleTwo
在模块列表中,只有['ngRoute']
下面是一个工作版本:
http://run.plnkr.co/8xIuvMIZSBYuITyN/working.html在working.html
中,我包含了所有模块:
angular.module('ngApp', ['ngRoute', 'moduleOne', 'moduleTwo']);
,所以它可以工作!
所以我的问题是:
我如何在one.html
和two.html
分别包括moduleOne
和moduleTwo
?
因为我不想像这样包含所有的模块
['ngRoute', 'moduleOne', 'moduleTwo', ...unknown modules]
我只是想包含
['ngRoute']
,并加载模板中的其余模块,以便在需要时加载它们。
我该怎么做?
注:如果你能纠正我的plnkr
或张贴一些代码,那将是最有帮助的!
如果不使用构建工具来允许导入,一种选择是将内容放在窗口的名称空间中。当包含脚本文件时,它们将自己添加到模块数组中。然后,这个数组被用作主应用的依赖项。
//in each of the deps:
window.modules = window.modules || [];
window.modules.push('moduleOne');
// another dep:
window.modules = window.modules || [];
window.modules.push('moduleTwo');
//in the main script loading the app
window.modules = window.modules || [];
window.modules.push('ngRoute');
var app = angular.module('ngApp', window.modules);
http://plnkr.co/edit/zyae1Y08Pe3WY3zbcutH?p =
预览这样做的缺点是它弄脏了window
。您可能会有一些其他脚本也取决于window.modules
混淆您的东西。你可以更好地命名它,但使用webpack、browserify、systemjs或其他…可以让你避免这一切
经过大量的搜索,我能够使它工作。诀窍是使用ocLazyLoad库。
这是工作的plunk:
http://goo.gl/wPeCAF让我知道你们的想法?
- 我如何才能包含一个iframe视频,这样它就不会't负载
- 在Django中,可以在视图中创建一个包含js的变量,然后在循环模板标记中使用它
- 如何检查数据表是否有任何包含字符串的行并获取它的行索引
- jQuery.inArray(),即使它包含数组中的值,也返回 -1
- 我如何找到包含在给定url的元标签中的页面描述(如果它有描述)
- 将jQuery包含到javascript中,并在imacros中使用它
- 引用包含的php页面中的对象,以及如何隐藏它
- 删除HTML脚本标记会对它所包含的JavaScript产生任何影响吗
- 为什么它要将包含的文件中的所有注释打印到屏幕上
- 如何找到td类并检查它是否包含类,然后我需要显示弹出窗口
- 删除一个元素,如果它包含某些内容,请使用 GreaseMonkey 中的 jQuery
- JS在我包含它后不起作用
- 将焦点设置在带有错误消息的第一个输入元素上,并将包含它的 TabStrip 选项卡设置为活动状态
- 需要从 ifram 获取高度属性值并设置父元素以包含它
- 我可以在jquery中创建一个包含它的化合物选择器吗?
- JavaScript在数学运算符处拆分,同时仍包含它
- 我不能让卷轴工作?如何包含它
- 如何将键值中的值分配给包含它的对象键
- 如何在AJAX的内容上使用javascript代码,而不每次都包含它
- JQuery 在包含它时会导致冲突