我最近审核了使用angular构建的webapp的代码,发现它是使用ng-app="myModule"
标记上的<body>
指令编写的。在学习角度时,我只会在<html>
标记上看到它,正如角度文档here,here以及tutorial中所建议的那样。
我自己对此进行了一些探索,发现了SO问题,特别是this one和类似this one,它们讨论了为页面加载多个模块的问题。但是,这种技术与我的情况不同,因为它涉及将ng-app放置在 主体内的元素上,并使用手动引导来同时运行两个角度应用程序。
据我所知,ng-app
或<html>
上<body>
的应用在运行时没有区别。据我了解,ng-app
指定了一个角度应用程序的根,因此将它放在<body>
上会使<head>
超出角度范围,但我想不出任何主要的这会影响事情。所以我的问题是:将ng-app
放在其中一个标签而不是另一个标签上有什么技术差异?
答案 0 :(得分:144)
您放置ng-app
的位置没有太大区别。
如果你把它放在<body>
上,那么AngularJS的范围就会更小,稍微更快。
但我在ng-app
上使用了<html>
来操纵<title>
。
答案 1 :(得分:21)
我参与了一个处理遗留应用程序的团队,并发现最好在div中使用ng-app标记,该div用作包装器以将新代码与遗留代码隔离开来。
我们在处理严重依赖jqGrid和Dojo的应用程序时发现了这一点。
当我们将ng-app添加到head标签时,它会炸毁网站,但是当我们使用包装器时,我们可以毫无问题地使用Angular。
答案 2 :(得分:4)
AngularJS将引导它找到的第一个ng-app!而已。如果您有多个ng-app,它将只处理第一个。如果你想引导任何其他元素,请使用angular.bootstrap()
ng-app属性的值是使用以下命令创建的模块:
angular.module("module_name", [])
模块定义了如何自动引导角度,因为我们没有与其他编程语言不同的main()方法。如果ng-app的值为空,则默认使用默认模块“ng”。
据说它稍快一点,因为angular会处理ng-app所在元素内的所有元素。但我有点怀疑,因为差异根本不会引起注意,除非你有一个非常庞大的DOM。
如果您需要示例:http://noypi-linux.blogspot.com/2014/07/angularjs-tutorials-understanding.html