angularjs1-2,作用域、代码压缩
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" src="angular.min.js"></script>
</head>
<body>
<div ng-app="myApp">
<div ng-controller="firstController">
{{name}}
{{age}}
{{sex}}
<div ng-controller="secondController">
{{name}}
{{age}}
{{sex}} //secondController作用域先在自己作用域查找,然后再去firstController查找,firstController也没有就去rootScope查找。
</div>
</div>
{{name}}
{{age}}
{{sex}}
</div>
<script type="text/javascript">
var app = angular.module("myApp", []);
//代码压缩不会把字符串压缩,只会把函数的形参压缩,因此前面写全,后面可以简写。
app.controller('firstController',['$scope',function($s){
$s.name='张三2';
}]);
app.controller('secondController',['$scope','$rootScope',function($s,$r){
$s.name='李四';
$r.age='30';
}]);
app.run(['$rootScope',function($r){
$r.name='ggggg';
$r.age='3333';
$r.sex='男';
}]);
console.log(app);
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" src="angular.min.js"></script>
</head>
<body>
<div ng-app="myApp">
<div ng-controller="firstController">
{{name}}
{{age}}
</div>
<div ng-controller="secondController">
{{name}}
{{age}}
</div>
</div>
<script type="text/javascript">
var app = angular.module("myApp", []);
app.controller('firstController',function($scope){
$scope.name='张三';
});
app.controller('secondController',function($scope,$rootScope){
// $scope.name='李四';
$rootScope.age='30';
})
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" src="../../angular.min.js"></script>
</head>
<body>
<div ng-app="myApp">
<div ng-controller="firstController">
{{name}}
</div>
<div ng-controller="secondController">
{{name}}
</div>
</div>
<script type="text/javascript">
var app = angular.module("myApp", []);
app.controller('firstController',function($scope){//scope的作用域是controller作用域
$scope.name='张三';
});
app.controller('secondController',function($scope){
$scope.name='李四';
})
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" src="../../angular.min.js"></script>
</head>
<body>
<div ng-app="myApp">
<div ng-controller="firstController">
姓名: {{name}} <br>
年龄:{{age}}
</div>
<div ng-controller="secondController">
姓名:{{name}}
年龄:{{age}}
</div>
</div>
<script type="text/javascript">
var app = angular.module("myApp", []);
app.controller('firstController',function($scope,$rootScope){//rootScope作用域是ng-app作用域
$scope.name='张三';
$rootScope.age='30';
});
app.controller('secondController',function($scope){
$scope.name='李四';
})
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" src="../angular.min.js"></script>
</head>
<body>
<div ng-app="myApp">
<div ng-controller="firstController">
{{name}}
{{age}}
{{sex}}
<div ng-controller="secondController">
{{name}}
{{age}}
{{sex}} //里层的作用域会去找外层的作用域
</div>
</div>
</div>
<script type="text/javascript">
var app = angular.module("myApp", []);
app.controller('firstController',function($scope){
$scope.name='张三1';
$scope.age='40';
});
app.controller('secondController',function($scope){
$scope.name='李四';
$scope.sex='男';
})
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" src="../angular.min.js"></script>
</head>
<body>
<div ng-app="myApp">
<div>
<p>{{name}}</p>
</div>
</div>
<script type="text/javascript">
var m1 = angular.module('myApp',[]);
m1.controller('Aaa',['$scope',function($scope){
$scope.name = 'hello111';
}]);
m1.controller('Bbb',['$scope',function($scope){
$scope.name = 'hi';
}]);
m1.run(['$rootScope',function($rootScope){
//run方法初始化全局数据,只对全局作用域起作用。
$rootScope.name = 'hello';
}]);
console.log( m1 );
</script>
</body>
</html>
angularjs1-2,作用域、代码压缩的更多相关文章
- UglifyJS--javascript代码压缩使用指南{转}
在线测试地址 http://lisperator.net/uglifyjs/下面都是基于linux系统的安装使用.UglifyJS是遵循了CommonJS规范写成的,可以在支持CommonJS模块系统 ...
- Asp.Net MVC 页面代码压缩筛选器-自定义删除无效内容
Asp.Net MVC 页面代码压缩筛选器 首先定义以下筛选器,用于代码压缩. /*页面压缩 筛选器*/ public class WhiteSpaceFilter : Stream { privat ...
- 使用Gulp进行代码压缩的步骤以及配置
一.安装步骤 1.首先确定是否安装了node.js,如果未安装,请先安装node.js: 2.确定是否安装了包管理工具npm,如未安装请安装:npm install npm -g: 3.安装gulp: ...
- 使用gulp进行代码压缩
gulp是一个很不错的前端自动化工具,可以帮我们完成一些重复性操作,比如html.css和js代码的压缩.合并.混淆等,虽然这些操作可以通过一些在线工具帮我们实现,但不断重复地复制粘贴肯定比不上一句命 ...
- fis代码压缩
Fis代码压缩步骤 1,安装fis(http://fis.baidu.com/fis3/docs/beginning/install.html) fis安装支持的node版本:0.8x,0.10x,0 ...
- 如何利用Grunt生成对应的Source Map文件,线上代码压缩使用chrome浏览器便于调式
如何利用Grunt生成对应的Source Map文件,线上代码压缩使用chrome浏览器便于调式 首先我们来说说为何要生成sourceMap文件呢?简单的说,sourceMap是为了压缩后的代码调式提 ...
- apicloud代码压缩和全局加密
首先说代码压缩,因为没什么用,就先说它了.代码压缩后,apicloud里面的css和js文件里面的空格呀回车呀都去掉了,就是文件小了,所有代码显示为一行了.这些代码的变量没有重命名,我们知道jquer ...
- HTML-DEV-ToolLink(常用的在线字符串编解码、代码压缩、美化、JSON格式化、正则表达式、时间转换工具、二维码生成与解码等工具,支持在线搜索和Chrome插件。)
HTML-DEV-ToolLink:https://github.com/easonjim/HTML-DEV-ToolLink 常用的在线字符串编解码.代码压缩.美化.JSON格式化.正则表达式.时间 ...
- php代码压缩
php代码压缩,除可以使用token_get_all进行压缩之外,还可以使用系统自带的函数 php_strip_whitespace (PHP 5) php_strip_whitespace — ...
随机推荐
- Java 系列之spring学习--注解(三)
一.注解 使用注解之前要开启自动扫描功能 <?xml version="1.0" encoding="UTF-8"?> <beans xmln ...
- Gitlab 维护措施
Gitlab 升级: https://jingyan.baidu.com/article/72ee561ab1b333e16038df63.html Gitlab Rpm包地址: https://pa ...
- Java电子书下载地址
http://www.itpub.net/search.php?searchid=1660&orderby=lastpost&ascdesc=desc&searchsubmit ...
- PCL:PCL可视化显示点云
(1):引用:仅仅是简单的显示点云,可以使用CloudViewer类.这个类非常简单易用.但要注意,它不是线程安全的.如果要用于多线程,还要参考PCLVisualizer. 需要注意的是,PointC ...
- Mysql优化-为表字段添加索引
1.添加PRIMARY KEY(主键索引): ALTER TABLE `table_name` ADD PRIMARY KEY ( `column` ) 2.添加UNIQUE(唯一索引) : ALTE ...
- Block Functionality
Block Functionality A block is an anonymous inline collection of code that: Has a typed argument lis ...
- js 获取 下拉框的值
//错误 console.log($("#DictID").select.val()); //错误 console.log($("#DictID").selec ...
- Laravel 查询某天数据 whereDate
- Ubuntu终端命令行缩短显示路径
平时我们使用linux终端命令行的时候,常常会被一个问题困扰,那就是文件路径过长, 有时候甚至超过了一行,这样看起来非常别扭,其实只要两步就可以解决这个问题: 1,修改.bashrc文件(用户根目录下 ...
- Python可视化数据------seaborn
可以看链接:https://blog.csdn.net/unixtch/article/details/78820654 1.import seaborn as sns 2.seaborn的主题风格( ...