AngularJS作用域（Scope）

Scope作用域是应用在视图和控制器之间的纽带，Scope是一个对象包含可用的方法和属性，Scope可以应用在试图和控制器上。

$scope是针对当前的controller的作用域生效

$rootScope是针对全局controller的作用域生效

下面使用代码进行这个作用域的演示

 <html>

 <head>

     <title>AngularJS作用域</title>

     <meta charset="utf-8" />

     <script src="js/angular.min.js"></script>

     <style>

         .frame {

         height:250px;

         border:1px solid black;

         background-color:lightblue;

         padding:10px;

         margin:20px;

         }

     </style>

 </head>

 <body ng-app="myApp">

     <div class="frame" ng-controller="oneController">

         scope1 :{{scope1}}<br />

         rootScope1: {{rootScope1}}<br />

         scope2 :{{scope2}}<br />

         rootScope2 :{{rootScope2}}<br />

     </div>

     <div class="frame" ng-controller="towController">

         scope1 :{{scope1}}<br />

         rootScope1: {{rootScope1}}<br />

         scope2 :{{scope2}}<br />

         rootScope2 :{{rootScope2}}<br />

     </div>

     <script>

         var app = angular.module("myApp", []);

         app.controller("oneController", function ($scope,$rootScope) {

             $scope.scope1 = "我是scope1";

             $rootScope.rootScope1 = "我是rootScope1";

         })

         app.controller("towController", function ($scope, $rootScope) {

             $scope.scope2 = "我是scope2";

             $rootScope.rootScope2 = "我是rootscope2";

         })

     </script>

 </body>

 </html>

AngularJS 作用域（Scope）的更多相关文章

  1. 理解AngularJS的作用域Scope

    AngularJS中,子作用域一般都会通过JavaScript原型继承机制继承其父作用域的属性和方法.但有一个例外:在directive中使用scope: { ... },这种方式创建的作用域是一个独 ...

  2. AngularJs之Scope作用域

    前言: 上篇博文AngularJs之directive中说了Scope作用域是个大坑,所以拿出来作为重点总结! 什么是scope AngularJS 中,作用域是一个指向应用模型的对象,它是表达式的执 ...

  3. 理解angularJS中作用域$scope

    angularJS中作用域是什么 作用域(scope)是构成angularJS应用的核心基础,在整个框架中都被广泛使用,因此了解它如何工作是非常重要的 应用的作用域是和应用的数据模型相关联的,同时作用 ...

  4. 转深入理解 AngularJS 的 Scope作用域

    文章转载英文:what-are-the-nuances-of-scope-prototypal-prototypical-inheritance-in-angularjs 中文:http://www. ...

  5. AngularJS：Scope（作用域）

    ylbtech-AngularJS:Scope(作用域) 1.返回顶部 1. AngularJS Scope(作用域) Scope(作用域) 是应用在 HTML (视图) 和 JavaScript ( ...

  6. angularJS（二）：作用域$scope、控制器、过滤器

    app.controller创建控制器 一.作用域 Scope(作用域) 是应用在 HTML (视图) 和 JavaScript (控制器)之间的纽带. Scope 是一个对象,有可用的方法和属性. ...

  7. 深入理解 AngularJS 的 Scope

    JavaScript 的原型继承就是奇葩. 之前在 V2EX 上看到讨论说,不会 OOP 的 JavaScript 的程序员就是野生程序员.看来我是属于野生的.   一.遇到的问题 问题发生在使用 A ...

  8. angularjs作用域

    作用域(scope)①是构成AngularJS应用的核心基础,在整个框架中都被广泛使用,因此了解它如何工作是非常重要的.应用的作用域是和应用的数据模型相关联的,同时作用域也是表达式执行的上下文.$sc ...

  9. AngularJS开发指南9：AngularJS作用域的详解

    AngularJS作用域是一个指向应用模型的对象.它是表达式的执行环境.作用域有层次结构,这个层次和相应的DOM几乎是一样的.作用域能监控表达式和传递事件. 作用域的特点 作用域提供APIs($wat ...

随机推荐

  1. たくさんの数式 / Many Formulas AtCoder - 2067 （枚举二进制）

    Problem Statement You are given a string S consisting of digits between 1 and 9, inclusive. You can ...

  2. Vue CLI 3使用：浏览器兼容性

    package.json 文件里的 browserslist 字段 (或一个单独的 .browserslistrc 文件),指定了项目的目标浏览器的范围.这个值会被 @babel/preset-env ...

  3. $(function(){})简述

    用jQ的人很多人都是这么开始写脚本的: $(function(){ // do something }); 其实这个就是jq ready()的简写,他等价于: $(document).ready(fu ...

  4. 返回通知 对方法返回的结果可以进行加工 例如请求接口后 返回的json参数可以加工成对象返回给调用者

  5. 洛谷P2822 组合数问题（题解）

    https://www.luogu.org/problemnew/show/P2822(题目传送) 先了解一下有关组合数的公式:(m在上,n在下) 组合数通项公式:C(n,m)=n!/[m!(n-m) ...

  6. css实现弹出框

    弹出框也是前端里面经常使用的一个应用场景了,最开始想到的是用js实现这个效果,看到codepen上面有用css实现的.其实就是用到了css里面的一个:target选择器+visibility属性. U ...

  7. Mycat的读写分离

    1. Mycat实现读写分离的部署: https://www.cnblogs.com/softidea/p/5447566.html springboot动态数据源的原理以及配置: Spring内置了 ...

  8. 收藏这些Safari快捷键，让你的Mac浏览网页更加方便

    文章内容及图片来源于:知乎,如果涉及版权问题,请联系作者删除 文章收录于:风云社区(提供上千款各类mac软件的下载) Safari是Mac上的原生浏览器,功能自然很强大,现在每天在Mac上使用的最多的 ...

  9. Hadoop记录- zookeeper 监控指标

    目前zookeeper获取监控指标已知的有两种方式: 1.通过zookeeper自带的 four letter words command 获取各种各样的监控指标 2.通过JMX Client连接zo ...

  10. Entity Framework入门教程（19)---EF中使用事务

    EF中使用事务 这节介绍EF6中事务的使用.EF core中事务的使用方式和EF6中一模一样. 1.EF中的默认的事务 默认情况下,当我们执行一个SaveChanges()方法时就会新建了一个事务,然 ...