ng-app一些使用
ng-app是angular的一个指令,代表一个angular应用(也叫模块)。使用ng-app或ng-app=""来标记一个DOM结点,让框架会自动加载。也就是说,ng-app是可以带属性值的。如果想要实现自动加载,那么就不能让ng-app带有属性值。而带属性的ng-app自己主动载入我们自己定义的模块作为根模块。
<html>
<body ng-app>
<div>div1:{{1+3*2}}</div>
<script src="angular.js"></script>
</body>
</html>
1、不含ng-app,无法自动加载。
<html>
<body>
<div>div1:{{1+3*2}}</div>
<script src="angular.js"></script>
</body>
</html>
2、含有2个ng-app,那么只会自动加载第一个。
<html>
<body>
<div ng-app>div1:{{1+3*2}}</div>
<div ng-app>div2:{{1+3*2}}</div>
<script src="angular.js"></script>
</body>
</html>
3、如果根节点有ng-app含有2个ng-app,那么两个都会加载。
<html>
<body ng-app=“”>
<div ng-app>div1:{{1+3*2}}</div>
<div ng-app>div2:{{1+3*2}}</div>
<script src="angular.js"></script>
</body>
</html>
4、ng-app带有属性,不能自动加载
<html>
<body>
<div ng-app="app1">div1:{{1+3*2}}</div>
<script src="angular.js"></script>
</body>
</html>
5、ng-app带有属性,可自动加载自己定义的模块
<!DOCTYPE html>
<html>
<head>
<head>
<body>
<div id="moudle1" ng-app="rootMoudle" ng-controller="rootControl">div1:{{name}}</div>
</body>
<script src="angular.js"></script>
<script>
var rootMoudle = angular.module('rootMoudle', []);
rootMoudle.controller("rootControl",function($scope){$scope.name="aty"});
</script>
</html>
6、angular.bootstrap()可以手动加载模块
<html>
<head>
<head>
<body>
<div id="moudle1" ng-app="rootMoudle" ng-controller="rootControl">div1:{{name}}</div>
</body>
<script src="angular-1.2.2/angular.js"></script>
<script>
//页面载入完毕后,载入rootMoudle
angular.element(document).ready(function(){
angular.bootstrap(document.getElementById("moudle1"), ['rootMoudle']);
});
</script>
</html>
ng-app一些使用的更多相关文章
- ng 依赖注入
将依赖的对象注入到当前对象,直接去使用依赖的对象即可. 降低耦合度.提高开发速度.. 文件压缩:yui-compressor有两种方案:①CLI(command line interface)java ...
- ng $http 和远程服务器通信的一个服务。
$http({url:'',method:''}).success().error() 简洁写法:$http.get()$http.post()... 注意事项:①要求返回的数据格式是json格式②在 ...
- ng $interval(周期性定时器) $timeout(延迟定时器)
<!DOCTYPE html> <html ng-app="myApp"> <head lang="en"> <met ...
- ng $scope与$rootScope的关系
$scope与$rootScope的关系:①不同的控制器之间 是无法直接共享数据②$scope是$rootScope的子作用域对象$scope的id是随着控制器的加载顺序依次递增,$rootScope ...
- ng 服务
服务的本质是单例对象,封装一些方法和属性的. 单例模式:在实例化变量的时候,如果该变量已经存在,直接返回该变量:如果不存在,就创建一个新的变量再返回 ng自带的服务有很多,常用:$location $ ...
- ng json格式的序列化和反序列化
ng中自带方法 angular.toJson 序列化angular.fromJson 反序列化 结果: 代码: <!DOCTYPE html> <html ng-app=" ...
- ng 过滤器
1.ng中自带的过滤器过滤器:实现对数据的筛选.过滤.格式化. 过滤器是一个有返回值的方法. 过滤器语法:{{ expression |过滤器1:'参数' | 过滤器2:'参数' }} | --> ...
- ng 双向数据绑定 实现 注册协议效果
效果: 代码: <!DOCTYPE html> <html ng-app="myApp"> <head lang="en"> ...
- ng 动态的生成option。
ngOptions:根据集合,动态的生成option. select ng-options="color.name for color in colorList" 注意跟ng-re ...
- ng 实现插入和删除
结果: 代码: <!DOCTYPE html> <html ng-app="myApp"> <head lang="en"> ...
随机推荐
- 虚拟机下Centos7如何设置静态IP地址
最近在学习linux环境部署~~~~ 首先,将网络适配设置成为桥接模式 查看本机IP地址,ipconfig,记住ipv4地址和默认网关地址,等会配置的时候要用 启动Centos,进入终端模式,设置IP ...
- Javascript实现时间转换为多少天前
//实现时间转换,这篇文章发布时间为 2016/1/20 19:59:30 文章发表时间戳为:1453291170000于:11月前function getDateDiff(dateTimeStamp ...
- window frida安装
当需要安装第三方python包时,可能会用到easy_install命令.easy_install是由PEAK(Python Enterprise Application Kit)开发的setupto ...
- HibernateSessionFactory建立-使用ThreadLocal
立即加载还是延迟加载必须要连接数据库的,而在Java中连接数据库是依赖java.sql.Connection,在hibernate中session就是Connection的一层高级封装,一个sessi ...
- 如何把家里的pc改装成linux服务器
家里有一台pc笔记本闲置在家,最近想搭建一个ubuntu系统玩一下kvm. 这个方法能避免家里宽带每隔一段时间ip自动变换. 我用到了: 1.亚马逊的aws(ec2) 2.家里的路由器 3.aws里装 ...
- 疯狂Java笔记
第四章: 4.6深入数组 1.栈内存和堆内存 每个方法都会建立自己的内存栈,在这个方法内定义的变量会逐个放入栈内存里,随着方法的执行结束,这个方法的内存栈也将自然销毁.因此,所有在方法中定义的局部变量 ...
- oracle--逻辑对象--bai
1 序列 sequence oracle特有.实现"自增"或"自减"的逻辑对象. 2 同义词 synonym 对表取别名,该别名被永久存储. 比视图更省资源. ...
- AngularJS版本下载
大家可以从下面地址获取AngularJS所以版本: https://code.angularjs.org/
- redis 操作string 的测试
1>set set name zhangsan :OK get name: zhangsan set name lisi:OK get name: lisi 2> setnx 如果存 ...
- 【转】一千行MySQL学习笔记
/* 启动MySQL */ net start mysql /* 连接与断开服务器 */ mysql -h 地址 -P 端口 -u 用户名 -p 密码 /* 跳过权限验证登录MySQL */ ...