我是Angular.js的新手,试图理解它与Backbone.js的不同之处……我们曾经在使用Backbone时使用Require.js来管理我们的包依赖关系。对Angular.js做同样的事情有意义吗?
当前回答
是的,这很有道理。
Angular模块不会尝试解决脚本加载顺序的问题 或者惰性脚本抓取。这些目标是正交的,都是模块 系统可以共存并实现它们的目标。 来源:Angular JS官方网站
其他回答
布莱恩·福特的回答
AngularJS有自己的模块系统,通常不需要RJS之类的东西。
参考:https://github.com/yeoman/generator-angular/issues/40
正如@ganaraj提到的,AngularJS的核心是依赖注入。在使用和不使用RequireJS构建玩具种子应用程序时,我个人发现RequireJS对于大多数用例来说可能是多余的。
That doesn't mean RequireJS is not useful for it's script loading capabilities and keeping your codebase clean during development. Combining the r.js optimizer (https://github.com/jrburke/r.js) with almond (https://github.com/jrburke/almond) can create a very slim script loading story. However since its dependency management features are not as important with angular at the core of your application, you can also evaluate other client side (HeadJS, LABjs, ...) or even server side (MVC4 Bundler, ...) script loading solutions for your particular application.
在AngularJS中使用RequireJS是有意义的,但前提是你要了解它们各自在依赖注入方面的工作原理,因为尽管它们都注入依赖,但它们注入的东西非常不同。
AngularJS有自己的依赖系统,它允许你将AngularJS模块注入到新创建的模块中,以便重用实现。假设你创建了一个"first"模块,它实现了AngularJS过滤器"greet":
angular
.module('first', [])
.filter('greet', function() {
return function(name) {
return 'Hello, ' + name + '!';
}
});
现在假设你想在另一个叫做“second”的模块中使用“greet”过滤器,这个模块实现了一个“goodbye”过滤器。你可以把"first"模块注入到"second"模块:
angular
.module('second', ['first'])
.filter('goodbye', function() {
return function(name) {
return 'Good bye, ' + name + '!';
}
});
问题是,为了在没有RequireJS的情况下正常工作,你必须确保在创建“第二个”AngularJS模块之前,页面上已经加载了“第一个”AngularJS模块。引用文件:
依赖于一个模块意味着需要加载所需的模块 在需要的模块加载之前。
在这个意义上,RequireJS可以帮助您,因为RequireJS提供了一种将脚本注入页面的干净方法,帮助您组织脚本之间的依赖关系。
回到“第一个”和“第二个”AngularJS模块,下面是如何使用RequireJS将模块分离到不同的文件中,以利用脚本依赖项加载:
// firstModule.js file
define(['angular'], function(angular) {
angular
.module('first', [])
.filter('greet', function() {
return function(name) {
return 'Hello, ' + name + '!';
}
});
});
// secondModule.js file
define(['angular', 'firstModule'], function(angular) {
angular
.module('second', ['first'])
.filter('goodbye', function() {
return function(name) {
return 'Good bye, ' + name + '!';
}
});
});
你可以看到,在RequireJS回调的内容被执行之前,我们依赖于“firstModule”文件被注入,这需要加载“第一个”AngularJS模块来创建“第二个”AngularJS模块。
边注:在“firstModule”和“secondModule”文件中注入“angular”,作为在RequireJS回调函数中使用AngularJS的依赖项,它必须在RequireJS配置中配置,以将“angular”映射到库代码中。你也可以用传统的方式(script标签)将AngularJS加载到页面中,尽管这与RequireJS的优点相违背。
更多关于AngularJS 2.0内核支持RequireJS的细节,请见我的博文。
根据我的博客文章“用AngularJS理解RequireJS”,这里有一个链接。
我认为这取决于你项目的复杂程度,因为angular是模块化的。 你的控制器可以被映射,你可以在index.html页面中导入那些JavaScript类。
但万一你的项目变大了。或者你预料到了这样的场景,你应该把angular和requirejs集成在一起。在本文中,您可以看到这种集成的演示应用程序。
如果你计划延迟加载控制器和指令等,那么在angularjs中使用requirejs是有意义的,同时还将多个延迟依赖组合到单个脚本文件中,以实现更快的延迟加载。RequireJS有一个优化工具,使组合变得容易。参见http://ify.io/using-requirejs-with-optimisation-for-lazy-loading-angularjs-artefacts/
推荐文章
- 克隆对象没有引用javascript
- 验证字符串是否为正整数
- 如何获得一个键/值JavaScript对象的键
- 什么时候JavaScript是同步的?
- 如何在Typescript中解析JSON字符串
- Javascript reduce()在对象
- 在angularJS中& vs @和=的区别是什么
- 错误"Uncaught SyntaxError:意外的标记与JSON.parse"
- JavaScript中的querySelector和querySelectorAll vs getElementsByClassName和getElementById
- 如何/何时使用ng-click调用路由?
- 给一个数字加上st, nd, rd和th(序数)后缀
- 如何以编程方式触发引导模式?
- setTimeout带引号和不带括号的区别
- 在JS的Chrome CPU配置文件中,'self'和'total'之间的差异
- 用javascript检查输入字符串中是否包含数字