1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5.         <title>无标题文档</title>
  6.         <script type="text/javascript" src="angular.min.js"></script>
  7.     </head>
  8.     <body>
  9.       <div ng-app="myApp">
  10.           <div ng-controller="firstController">
  11.               {{name}}
  12.               {{age}}
  13.               {{sex}}
  14.               <div ng-controller="secondController">
  15.                   {{name}}
  16.                   {{age}}
  17.                   {{sex}}   //secondController作用域先在自己作用域查找，然后再去firstController查找，firstController也没有就去rootScope查找。
  18.               </div>
  19.           </div>
  20.           {{name}}
  21.           {{age}}
  22.           {{sex}}
  23.       </div>
  24.       <script type="text/javascript">
  25.           var app = angular.module("myApp", []);
  26.           //代码压缩不会把字符串压缩，只会把函数的形参压缩，因此前面写全，后面可以简写。
  27.           app.controller('firstController',['$scope',function($s){
  28.              $s.name='张三2';
  29.           }]);
  30.           app.controller('secondController',['$scope','$rootScope',function($s,$r){
  31.               $s.name='李四';
  32.               $r.age='30';
  33.           }]);
  34.           app.run(['$rootScope',function($r){
  35.             $r.name='ggggg';
  36.             $r.age='3333';
  37.             $r.sex='男';
  38.           }]);
  39.           console.log(app);
  40.       </script>
  41.     </body>
  42. </html>
  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5.         <title>无标题文档</title>
  6.         <script type="text/javascript" src="angular.min.js"></script>
  7.     </head>
  8.     <body>
  9.       <div ng-app="myApp">
  10.           <div ng-controller="firstController">
  11.               {{name}}
  12.               {{age}}
  13.           </div>
  14.           <div ng-controller="secondController">
  15.               {{name}}
  16.               {{age}}
  17.           </div>
  18.       </div>
  19.       <script type="text/javascript">
  20.           var app = angular.module("myApp", []);
  21.           app.controller('firstController',function($scope){
  22.               $scope.name='张三';
  23.           });
  24.           app.controller('secondController',function($scope,$rootScope){
  25.              // $scope.name='李四';
  26.               $rootScope.age='30';
  27.           })
  28.       </script>
  29.     </body>
  30. </html>
  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5.         <title>无标题文档</title>
  6.         <script type="text/javascript" src="../../angular.min.js"></script>
  7.     </head>
  8.     <body>
  9.       <div ng-app="myApp">
  10.           <div ng-controller="firstController">
  11.               {{name}}
  12.           </div>
  13.           <div ng-controller="secondController">
  14.               {{name}}
  15.           </div>
  16.       </div>
  17.       <script type="text/javascript">
  18.           var app = angular.module("myApp", []);
  19.           app.controller('firstController',function($scope){//scope的作用域是controller作用域
  20.               $scope.name='张三';
  21.           });
  22.           app.controller('secondController',function($scope){
  23.               $scope.name='李四';
  24.           })
  25.       </script>
  26.     </body>
  27. </html>
  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5.         <title>无标题文档</title>
  6.         <script type="text/javascript" src="../../angular.min.js"></script>
  7.     </head>
  8.     <body>
  9.       <div ng-app="myApp">
  10.           <div ng-controller="firstController">
  11.              姓名： {{name}} <br>
  12.              年龄：{{age}}
  13.           </div>
  14.           <div ng-controller="secondController">
  15.               姓名：{{name}}
  16.               年龄：{{age}}
  17.           </div>
  18.       </div>
  19.       <script type="text/javascript">
  20.           var app = angular.module("myApp", []);
  21.           app.controller('firstController',function($scope,$rootScope){//rootScope作用域是ng-app作用域
  22.               $scope.name='张三';
  23.               $rootScope.age='30';
  24.           });
  25.           app.controller('secondController',function($scope){
  26.               $scope.name='李四';
  27.           })
  28.       </script>
  29.     </body>
  30. </html>
  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5.         <title>无标题文档</title>
  6.         <script type="text/javascript" src="../angular.min.js"></script>
  7.     </head>
  8.     <body>
  9.       <div ng-app="myApp">
  10.           <div ng-controller="firstController">
  11.               {{name}}
  12.               {{age}}
  13.               {{sex}}
  14.               <div ng-controller="secondController">
  15.                   {{name}}
  16.                   {{age}}
  17.                   {{sex}}   //里层的作用域会去找外层的作用域
  18.               </div>
  19.           </div>
  20.       </div>
  21.       <script type="text/javascript">
  22.           var app = angular.module("myApp", []);
  23.           app.controller('firstController',function($scope){
  24.               $scope.name='张三1';
  25.               $scope.age='40';
  26.           });
  27.           app.controller('secondController',function($scope){
  28.               $scope.name='李四';
  29.               $scope.sex='男';
  30.           })
  31.       </script>
  32.     </body>
  33. </html>
  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5.         <title>无标题文档</title>
  6.         <script type="text/javascript" src="../angular.min.js"></script>
  7.     </head>
  8.     <body>
  9.       <div ng-app="myApp">
  10.           <div>
  11.               <p>{{name}}</p>
  12.           </div>
  13.       </div>
  14.       <script type="text/javascript">
  15.           var m1 = angular.module('myApp',[]);
  16.           m1.controller('Aaa',['$scope',function($scope){
  17.                 $scope.name = 'hello111';
  18.            }]);
  19.            m1.controller('Bbb',['$scope',function($scope){
  20.                 $scope.name = 'hi';
  21.            }]);
  22.           m1.run(['$rootScope',function($rootScope){
  23.           //run方法初始化全局数据，只对全局作用域起作用。
  24.               $rootScope.name = 'hello';
  25.           }]);
  26.           console.log( m1 );
  27.       </script>
  28.     </body>
  29. </html>

angularjs1-2,作用域、代码压缩的更多相关文章

  1. UglifyJS--javascript代码压缩使用指南{转}

    在线测试地址 http://lisperator.net/uglifyjs/下面都是基于linux系统的安装使用.UglifyJS是遵循了CommonJS规范写成的,可以在支持CommonJS模块系统 ...

  2. Asp.Net MVC 页面代码压缩筛选器-自定义删除无效内容

    Asp.Net MVC 页面代码压缩筛选器 首先定义以下筛选器,用于代码压缩. /*页面压缩 筛选器*/ public class WhiteSpaceFilter : Stream { privat ...

  3. 使用Gulp进行代码压缩的步骤以及配置

    一.安装步骤 1.首先确定是否安装了node.js,如果未安装,请先安装node.js: 2.确定是否安装了包管理工具npm,如未安装请安装:npm install npm -g: 3.安装gulp: ...

  4. 使用gulp进行代码压缩

    gulp是一个很不错的前端自动化工具,可以帮我们完成一些重复性操作,比如html.css和js代码的压缩.合并.混淆等,虽然这些操作可以通过一些在线工具帮我们实现,但不断重复地复制粘贴肯定比不上一句命 ...

  5. fis代码压缩

    Fis代码压缩步骤 1,安装fis(http://fis.baidu.com/fis3/docs/beginning/install.html) fis安装支持的node版本:0.8x,0.10x,0 ...

  6. 如何利用Grunt生成对应的Source Map文件,线上代码压缩使用chrome浏览器便于调式

    如何利用Grunt生成对应的Source Map文件,线上代码压缩使用chrome浏览器便于调式 首先我们来说说为何要生成sourceMap文件呢?简单的说,sourceMap是为了压缩后的代码调式提 ...

  7. apicloud代码压缩和全局加密

    首先说代码压缩,因为没什么用,就先说它了.代码压缩后,apicloud里面的css和js文件里面的空格呀回车呀都去掉了,就是文件小了,所有代码显示为一行了.这些代码的变量没有重命名,我们知道jquer ...

  8. HTML-DEV-ToolLink（常用的在线字符串编解码、代码压缩、美化、JSON格式化、正则表达式、时间转换工具、二维码生成与解码等工具，支持在线搜索和Chrome插件。）

    HTML-DEV-ToolLink:https://github.com/easonjim/HTML-DEV-ToolLink 常用的在线字符串编解码.代码压缩.美化.JSON格式化.正则表达式.时间 ...

  9. php代码压缩

    php代码压缩,除可以使用token_get_all进行压缩之外,还可以使用系统自带的函数   php_strip_whitespace (PHP 5) php_strip_whitespace — ...

随机推荐

  1. BZOJ 3992 DP+NTT+快速幂

    思路: 普通的DP很好想吧 f[i][j]+=f[i-1][j*s[k]]  前i个数  mod m=j 的个数 m是质数  模数是质数  这就很有趣了 那么我们就求出来原根  所有的数都取指数 搞出 ...

  2. 本地sql文件导入mysql数据库

    mysql中配置my.ini interactive_timeout = 120 wait_timeout = 120 max_allowed_packet = 32M 导入sql运行命令 sourc ...

  3. Java程序连接各种数据库的driver和url形式

    1.Oracle数据库 Class.forName("oracle.jdbc.driver.OracleDriver").newInstance(); String url = & ...

  4. 2019苏州凯美瑞德Java开发面试

    第四家Kmerit,苏州园区,出门晚了差点迟到,一点五十五到达,先花了一小时笔试,后来两个人技术面试,四点二十出了大楼. 一.笔试 1.单选,知识点很散,涉及数据结构链表,数组,树,堆,数据库,网络, ...

  5. 使用eclipse，对spring boot 进行springloader或者devtool热部署失败处理方法

    确定配置进行依赖和配置没有错误后. 调整spring boot 的版本,因为新版本对老版本的spring boot 不能使用. 改为: <groupId>org.springframewo ...

  6. spring中log4j的使用---转载

    原文链接:http://www.codeceo.com/article/log4j-usage.html 日志是应用软件中不可缺少的部分,Apache的开源项目log4j是一个功能强大的日志组件,提供 ...

  7. TF基础5

    卷积神经网络CNN 卷积神经网络的权值共享的网络结构显著降低了模型的复杂度,减少了权值的数量. 神经网络的基本组成包括输入层.隐藏层和输出层. 卷积神经网络的特点在于隐藏层分为卷积层和池化层. pad ...

  8. Maven安装+配置

    原先的项目构建属于Ant,就是先export成jar文件,然后引用. Maven依赖一定是引用本地仓库的,所以会先从中央仓库把依赖下载下来存到本地.和NuGet是一样的. 下载 地址 选择一个zip, ...

  9. jquery-ui实现拖拽功能

    https://www.runoob.com/jqueryui/jqueryui-tutorial.html

  10. C++基础 (2) 第二天 C++相对C的改进 命名空间 引用

    1 昨日回顾 2内联函数 3 默认参数和占位参数 4函数重载 函数重载 就是可以定义多个相同名字的函数 6 类和对象的基本语法 7 类的封装和访问控制 还有一个结论: 封装有两层含义: 把属性和方法进 ...