AngularJS 作用域(Scope)
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)的更多相关文章
- 理解AngularJS的作用域Scope
AngularJS中,子作用域一般都会通过JavaScript原型继承机制继承其父作用域的属性和方法.但有一个例外:在directive中使用scope: { ... },这种方式创建的作用域是一个独 ...
- AngularJs之Scope作用域
前言: 上篇博文AngularJs之directive中说了Scope作用域是个大坑,所以拿出来作为重点总结! 什么是scope AngularJS 中,作用域是一个指向应用模型的对象,它是表达式的执 ...
- 理解angularJS中作用域$scope
angularJS中作用域是什么 作用域(scope)是构成angularJS应用的核心基础,在整个框架中都被广泛使用,因此了解它如何工作是非常重要的 应用的作用域是和应用的数据模型相关联的,同时作用 ...
- 转深入理解 AngularJS 的 Scope作用域
文章转载英文:what-are-the-nuances-of-scope-prototypal-prototypical-inheritance-in-angularjs 中文:http://www. ...
- AngularJS:Scope(作用域)
ylbtech-AngularJS:Scope(作用域) 1.返回顶部 1. AngularJS Scope(作用域) Scope(作用域) 是应用在 HTML (视图) 和 JavaScript ( ...
- angularJS(二):作用域$scope、控制器、过滤器
app.controller创建控制器 一.作用域 Scope(作用域) 是应用在 HTML (视图) 和 JavaScript (控制器)之间的纽带. Scope 是一个对象,有可用的方法和属性. ...
- 深入理解 AngularJS 的 Scope
JavaScript 的原型继承就是奇葩. 之前在 V2EX 上看到讨论说,不会 OOP 的 JavaScript 的程序员就是野生程序员.看来我是属于野生的. 一.遇到的问题 问题发生在使用 A ...
- angularjs作用域
作用域(scope)①是构成AngularJS应用的核心基础,在整个框架中都被广泛使用,因此了解它如何工作是非常重要的.应用的作用域是和应用的数据模型相关联的,同时作用域也是表达式执行的上下文.$sc ...
- AngularJS开发指南9:AngularJS作用域的详解
AngularJS作用域是一个指向应用模型的对象.它是表达式的执行环境.作用域有层次结构,这个层次和相应的DOM几乎是一样的.作用域能监控表达式和传递事件. 作用域的特点 作用域提供APIs($wat ...
随机推荐
- 打包优化实践(如何Code Spliting)
项目地址:ReactSPA 使用 webpack 插件找出占用空间较大的包 开发环境中可使用 analyze-webpack-plugin 观察各模块的占用情况.以该项目为例:浏览器中输入 http: ...
- input 各种限制
test 1.限制只能输入或黏贴11位长度的数字 <input onkeyup="this.value=this.value.replace(/\D/g,'')" onaft ...
- JavaScript验证输入的字符是否包含表情
以下是验证代码: function isEmojiCharacter(substring) { for ( var i = 0; i < substring.length; i++) { var ...
- python配置文件的加载
背景: 微信机器人项目用到了mysql数据库配置,阿里云OSS上传文件配置:现在需要将这些配置参数统一写到一个配置文件中统一管理,而不是分散的写在代码中 1. 使用.ini文件作为配置文件 例如: s ...
- tomcat知识(一)
1.tomcat配置javaWeb项目常见错误: ①:端口占用 ②:未配置JAVA_HOME环境变量 2.tomcat修改端口号 tomcat安装路径下面找到conf文件夹,修改server.xml文 ...
- LODOP整页缩放,宽度、高度溢出缩放
LODOP中,超文本超过打印项高度会自动分页,可以用语句进行缩放,让打印内容都在一页中.例如,整页缩放和高度溢出缩放.如下是三个语句及其效果,注意对内容缩放可能会导致变形哦,毕竟是不等比例缩放:LOD ...
- Microsoft Visual Studio Tools for AI
https://www.visualstudio.com/zh-hans/downloads/ai-tools-vs/ 开发.调试和部署深度学习和 AI 解决方案 Visual Studio Tool ...
- consul如何限制注册的ip
假设当前服务器的ip是:192.168.56.130 允许 所有ip 注册 consul agent -server -ui -bootstrap-expect=1 -data-dir=/usr/lo ...
- kibana连接elasticsearch集群做负载均衡
问题背景: 在ELK架构中,kibana一般配置连接elasticsearch的时候,配置文件中的写法一般如下: ……# The URL of the Elasticsearch instance t ...
- 51nod1812树的双直径(换根树DP)
传送门:http://www.51nod.com/Challenge/Problem.html#!#problemId=1812 题解:头一次写换根树DP. 求两条不相交的直径乘积最大,所以可以这样考 ...