新手学AngularJs之ng-app

最新推荐文章于 2021-07-09 16:38:39 发布

A爱吃番茄

最新推荐文章于 2021-07-09 16:38:39 发布

阅读量1k

点赞数

文章标签： angularjs

本文链接：https://blog.csdn.net/u013806366/article/details/51849148

版权

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，且带有属性，那么在页面初始化加载的时候，是没有办法完成自动加载的。

A爱吃番茄

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
新手学AngularJs之ng-app

ng-app:是angular的一个指令，使用ng-app或者ng-app=”“来标记一个dom节点，让框架会自动加载，换言之也就是说ng-app是可以带属性的，用ng-app来标记了某一个dom节点，就表示要告诉angular，当前标记的这个节点的所有元素都是angularJS的所有者。那么对于标记ng-app小节了下面几种情况？ 1、不写ng-app 如果不屑ng-app，那
复制链接

扫一扫