ng-app
ng-app:是angular的一个指令,使用ng-app或者ng-app=”“来标记一个dom节点,让框架会自动加载,换言之也就是说ng-app是可以带属性的,用ng-app来标记了某一个dom节点,就表示要告诉angular,当前标记的这个节点的所有元素都是angularJS的所有者。
那么对于标记ng-app小节了下面几种情况?
1、不写ng-app
如果不屑ng-app,那么就无法加载对应的代码,说土了就是没有告诉angular那一部分代码是归它管。
如下一段html代码,没有标记ng-app
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="../js/angular.js"></script>
</head>
<body>
<div>
<p>姓名21111:{{1+2}} </p>
</div>
</body>
</html>
加载结果:angularjs表达式里的代码并没有运算。
姓名21111: {{1+2}}
2、标记了两个ng-app
加载的结果是:angularjs只会自动加载第一个,且ng-app不带属性。
如下范例代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="../js/angular.js"></script>
</head>
<body>
<div data-ng-app="">
<p>姓名21111:{{1+2}} </p>
</div>
<div data-ng-app="">
<p>姓名33333:{{2+2}} </p>
</div>
</body>
</html>
加载的效果:
姓名21111:3
姓名33333:{{2+2}}
ps:ng-app可以看作java里的main方法,只能存在一个。
3、如果标记了ng-app,但是ng-app带了属性会是什么结果?
如下范例代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="../js/angular.js"></script>
</head>
<body>
<div data-ng-app="app">
<p>姓名21111:{{1+2}} </p>
</div>
</body>
</html>
加载效果:
姓名21111:{{1+2}}
ps:如果标记了ng-app,且带有属性,那么在页面初始化加载的时候,是没有办法完成自动加载的。