Angularjs学习笔记（一）
大部分传统的模板系统，对模板的渲染是个线性单向的过程；模板或变量与模板混合在一起产生结果的标记集合。任何对模型的改变都需要通过模板的重新计算。但AngularJS有所不同，任何用户引发的视图的改变，都会映射在模型上，继而任何模型的改变，也会立即传播到整个模板。
一、作用域
AngularJS中的$scope对象是模板的域模型(domain model),也称为作用域实例(instance)。通过对其赋值，可以传递数据给模板渲染。
每个$scope都是Scope类的实例。Scope类有很多方法，用于控制作用域的生命周期、提供事件传播(event-progagation)功能，以及支持模板的渲染等。
1.1 作用域层级
ng-controller指令是作用域创建(scope-creating)指令。当在DOM树中遇到作用域创建指令时，AngularJS都会创建Scope类的新实例$scope。新创建的作用域实例$scope会拥有$parent属性，并指向它的父作用域。
AngularJS拥有$routScope，它是其他所有作用域的父作用域，将在新应用启动时创建。众多作用域形成了以$rootScope为根的树结构。
1.2 作用域层级和继承
作用域中定义的属性对所有子作用域是可见的，只要子作用域没有定义同名的属性。
AngularJS中的作用域继承和Javascript中的原型继承遵循同样的规则，沿继承树向上查找属性，直至找到为止。
1.3 在作用域层级中继承的风险
有两种方法可以从子作用域中影响定义在父作用域中的属性:
首先，可以使用$parent属性明确地引用父作用域。但这种解决方案相当不可靠。
另一种解决方案是将变量绑定为某对象的属性，而不是直接绑定为作用域的属性。
<body ng-app ng-init="thing={name:'World'}">
<h1>Hello,{{thing.name}}<h1>
<div ng-controller="HelloCtrl">
Say hello to:<input type="text" ng=model="thing.name">
<h2>Hello,{{thing.name}}!</h2>
</div>
</body>
1.4 作用域生命周期
作用域提供独立的命名空间，避免变量的命名冲突。因此，小型、组织良好的作用域，能节约内存的使用。作用域在不需要后会被销毁，在其中暴露的模型和函数都会被垃圾回收。
二、控制器
控制器的主要职责是初始化作用域实例。
2.1 提供模型的初始值。
2.2 增加UI相关的行为(函数)以扩展$scope对象。
控制器可以让你在JavaScript代码中表达初始化逻辑，而不是污染HTML模板。
三、模型
AngularJS的模型（model）实际上就是普通的JavaScript对象。与控制器类似，不需要特别地去扩展任何AngularJS底层类，也不用去构造模型对象。
四、视图
AngularJS与HTML和DOM有着更加紧密的联系，因为AngularJS依靠浏览器去解析模板文本，浏览器将文本转换成DOM树之后，AngularJS参与进来，开始遍历解析好的DOM结构。当遇到指令时，AngularJS就执行相关逻辑，将指令转换成页面的动态部分。
Angularjs学习笔记（一）的更多相关文章
- AngularJs学习笔记--Forms
原版地址:http://code.angularjs.org/1.0.2/docs/guide/forms 控件(input.select.textarea)是用户输入数据的一种方式.Form(表单) ...
- AngularJs学习笔记--expression
原版地址:http://code.angularjs.org/1.0.2/docs/guide/expression 表达式(Expressions)是类Javascript的代码片段,通常放置在绑定 ...
- AngularJs学习笔记--directive
原版地址:http://code.angularjs.org/1.0.2/docs/guide/directive Directive是教HTML玩一些新把戏的途径.在DOM编译期间,directiv ...
- AngularJs学习笔记--Guide教程系列文章索引
在很久很久以前,一位前辈向我推荐AngularJs.但当时我没有好好学习,仅仅是讲文档浏览了一次.后来觉醒了……于是下定决心好好理解这系列的文档,并意译出来(英文水平不足……不能说是翻译,有些实在是看 ...
- AngularJs学习笔记--bootstrap
AngularJs学习笔记系列第一篇,希望我可以坚持写下去.本文内容主要来自 http://docs.angularjs.org/guide/ 文档的内容,但也加入些许自己的理解与尝试结果. 一.总括 ...
- AngularJs学习笔记--html compiler
原文再续,书接上回...依旧参考http://code.angularjs.org/1.0.2/docs/guide/compiler 一.总括 Angular的HTML compiler允许开发者自 ...
- AngularJs学习笔记--concepts(概念)
原版地址:http://code.angularjs.org/1.0.2/docs/guide/concepts 继续.. 一.总括 本文主要是angular组件(components)的概览,并说明 ...
- AngularJS学习笔记2——AngularJS的初始化
本文主要介绍AngularJS的自动初始化以及在必要的适合如何手动初始化. Angular <script> Tag 下面通过一小段代码来介绍推荐的自动初始化过程: <!doctyp ...
- AngularJs学习笔记--Using $location
原版地址:http://code.angularjs.org/1.0.2/docs/guide/dev_guide.services.$location 一.What does it do? $loc ...
- AngularJs学习笔记--unit-testing
原版地址:http://docs.angularjs.org/guide/dev_guide.unit-testing javascript是一门动态类型语言,这给她带来了很强的表现能力,但同时也使编 ...
随机推荐
- 每天一个 Linux 命令（17）：whereis 命令
whereis命令只能用于程序名的搜索,而且只搜索二进制文件(参数-b).man说明文件(参数-m)和源代码文件(参数-s).如果省略参数,则返回所有信息. 和find相比,whereis查找的速度非 ...
- log4cplus 直接创建logger 对象
#include <log4cplus/loggingmacros.h> #include <log4cplus/fileappender.h> #include <lo ...
- 问题解决_(转载)VS2015无法启动 IIS Express Web解决办法
将“重写应用程序根URL”的勾选去掉,然后就可正常运行 参考资料:http://www.qi88.com/edu/os/2015/0103/87648.html
- 新华龙电子推出最新网络开发板(W5100&W5500方案)
2014/12/16 | Filed under: TCP/IP芯片 and tagged with: C8051, W5100, W5500, 新华龙电子, 网络开发板 42 Views 深圳新华龙 ...
- PHP数组的常用函数
在PHP中数组是种强大的数据类型,他可以做的事情很多,可以存储不同的数据类型在一个数组中,下面我们列出了数组常用的操作,排序,键名对数组排序等做法. /* 数组的常用函数 * * 数组的排序函数 ...
- leetcode-【中等题】Divide Two Integers
题目 Divide two integers without using multiplication, division and mod operator. If it is overflow, r ...
- javascript call与apply关键字的作用
apply接受两个参数.第一个参数指定函数体内this对象的指向,第二个参数为一个带下标的集合. call则是apply的语法糖,如果参数数量固定,则可以不用带下标的集合传第二个参数. 1 2 3 4 ...
- MacOS changed System Integrity Protection status
禁止 System Integrity Protection 按住 command + R 重启系统 进入单用户模式 启动bash工具: 输入: csrutil disable 输入:reboot 启 ...
- Android IOS WebRTC 音视频开发总结（二五）-- webrtc优秀资源汇总
本文主要整理一些webrtc相关资料供学习(会持续更新),转载请说明出处,文章来自博客园RTC.Blacker,欢迎关注微信公众号:blackerteam ---------------------- ...
- java学习第13天( java获取当前时间,有关大数据的运算及精确数字运算,Date类)
一 java获取当前时间 学习一个函数,得到当前时间的准确值 System.currectTimeMillis(). 可以得到以毫秒为单位的当前时间.它主要用于计算程序运行时间,long start= ...