angular-Scope
Scope(作用域) 是应用在 HTML (视图) 和 JavaScript (控制器)之间的纽带。
Scope 是一个对象,有可用的方法和属性。
Scope 可应用在视图和控制器上。
当你在 AngularJS 创建控制器时,你可以将 $scope 对象当作一个参数传递:
<div ng-app="myApp" ng-controller="myCtrl">- <h1>{{carname}}</h1>
</div>- <script>
var app = angular.module('myApp', []);- app.controller('myCtrl', function($scope) {
$scope.carname = "Volvo";});</script>
AngularJS 应用组成如下:
- View(视图), 即 HTML。
- Model(模型), 当前视图中可用的数据。
- Controller(控制器), 即 JavaScript 函数,可以添加或修改属性。
所有的应用都有一个 $rootScope,它可以作用在 ng-app 指令包含的所有 HTML 元素中。
$rootScope 可作用于整个应用中。是各个 controller 中 scope 的桥梁。用 rootscope 定义的值,可以在各个 controller 中使用。
<div ng-app="myApp" ng-controller="myCtrl"><h1>{{lastname}} 家族成员:</h1><ul><li ng-repeat="x in names">{{x}} {{lastname}}</ul></div><script>var app = angular.module('myApp', []);app.controller('myCtrl', function($scope, $rootScope) {$scope.names = ["Emil", "Tobias", "Linus"];$rootScope.lastname = "Refsnes";});</script>
监听器
$watch简单使用
$watch是一个scope函数,用于监听模型变化,当你的模型部分发生变化时它会通知你。
$watch(watchExpression, listener, objectEquality);
每个参数的说明如下:
watchExpression:监听的对象,它可以是一个angular表达式如'name',或函数如function(){return $scope.name}。
listener:当watchExpression变化时会被调用的函数或者表达式,它接收3个参数:newValue(新值), oldValue(旧值), scope(作用域的引用)
objectEquality:是否深度监听,如果设置为true,它告诉Angular检查所监控的对象中每一个属性的变化. 如果你希望监控数组的个别元素或者对象的属性而不是一个普通的值, 那么你应该使用它
angular-Scope的更多相关文章
- angular $scope对象
$scope是一个pojo对象 $scope提供了一些工具方法.例如:$watch() $apply(),一般不会手工去调用 $scope是表达式的执行环境也叫作用域 $scope是一个树形结构,与D ...
- Angular $scope和$rootScope事件机制之$emit、$broadcast和$on
Angular按照发布/订阅模式设计了其事件系统,使用时需要“发布”事件,并在适当的位置“订阅”或“退订”事件,就像邮箱里面大量的订阅邮件一样,当我们不需要时就可以将其退订了.具体到开发中,对应着$s ...
- [AngularJS] Using the Angular scope $destroy event and method
With Angular scopes, you have access to a $destroy event that can be used to watch $scope events. Th ...
- Angular $scope和$rootScope
<!DOCTYPE html><html ng-app='myModule'><head lang="en"> <meta charset ...
- angular $scope.$watch
在$scope内置的所有函数中,用得最多的可能就是$watch 函数了.当你的数据模型中某一部分发生变化时,$watch函数可以向你发出通知. 你可以监控单个对象的属性,也可以监控需要经过计算的结果( ...
- Angular Scope解析与应用
Scope层级结构 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA== ...
- Angular之 Scope和 Directive
---------------------------Scope-------------------------------- https://docs.angularjs.org/guide/sc ...
- ANGULAR JS WATCH监听使用(详)
ANGULAR 监听使用: 当angular数据模型发生变化时,我们需要如果需要根据他的变化触发其他的事件. $watch是一个scope函数,用于监听模型变化,当你的模型部分发生变化时它会通知你. ...
- 【原创】angularjs1.3.0源码解析之scope
Angular作用域 前言 之前我们探讨过Angular的执行流程,在一切准备工作就绪后(我是指所有directive和service都装载完毕),接下来其实就是编译dom(从指定的根节点开始遍历do ...
- angular 自定义指令 link
function link(scope, element, attrs) { ... } where: scope is an Angular scope object. element is the ...
随机推荐
- poj 1611 简单并查集的应用
#include<stdio.h> #define N 31000 int pre[N]; int find(int x) { if(x!=pre[x]) pre[x]=find( ...
- java 线程安全和不安全
线程安全就是多线程访问时,采用了加锁机制,当一个线程访问该类的某个数据时,进行保护,其他线程不能进行访问直到该线程读取完,其他线程才可使用.不会出现数据不一致或者数据污染.(Vector,HashTa ...
- BA-闭式冷却塔系统
- cogs 106. [NOIP2003] 加分二叉树(区间DP)
106. [NOIP2003] 加分二叉树 ★☆ 输入文件:jfecs.in 输出文件:jfecs.out 简单对比时间限制:1 s 内存限制:128 MB [问题描述] 设 一个 n ...
- 非阻塞IO函数
关于效率的优化:
- 【解决】run-as: Package '' is unknown
问题: [2014-07-30 20:20:25 - nativeSensorStl] gdbserver output: [2014-07-30 20:20:25 - nativeSensorStl ...
- 自己定义Android Dialog
private void showDialog() { mDialog = new Dialog(this); mDialog.setCanceledOnTouchOutside(true); Win ...
- 分享:Android系统的经常使用权限整理
1.ACCES_NETWORK_STATE 同意应用程序获取网络状态信息的权限 2.ACCESS_WIFI_STATE 同意应用程序获取Wi-Fi网络状态的权限 3.BAT ...
- css3子级高度与父级同高,内容垂直居中
.E-wrap{ overflow: hidden; position: relative; border: 1px solid #ccc; margin: 30px auto 0; width: 5 ...
- What is the difference between arguments and parameters?
What is the difference between arguments and parameters? Parameters are defined by the names that ap ...