angular.js 中的作用域 数据模型 控制器
1.angular.js 作为后起之秀的前端mvc框架,他于传统的前端框架都不同,我们再也不需要在html中嵌入脚本来操作对象了.
它抽象出了数据模型,控制器及视图.
成功解耦了应用逻辑,数据模型,视图.
2.它的视图也不是后台统一替换后渲染页面,而是视图被动态实时替换.
视图上可以通过指定的 angular.js 指令来绑定模型数据.模型数据的变化又会直接影响视图的变化.
3.控制器就像一座桥梁,负责连接模型和视图, 模型里包括数据和与数据进行交互的方法.
视图只负责把模型数据的映射显示给用户.
4.angular.js 会记录数据模型中的数据在任意时间点的值,如果在某个时间点,angular.js 发现当前保存的值和上次记录的值发生了变化,那么该值就被认为是"脏"的,angular.js 就会做出相应的响应变化.
它会实时循环调用 $digest()这个方法来做脏检查,保证数据的一致性
5.一个controller 对应一个数据模型对象 $scoe
通过 ng-model 来将内部数据模型对象 $scope 中的属性绑定到视图的某个字段上.
6.$scope模型对象是一个简单的javascript对象,他的属性可以被视图访问,也可以和控制器交互.
$scope因为上面的特性,所以实现双向绑定就是指:angular.js通过 $digest()方法来脏检查,如果视图发生改变导致模型对象某个属性有变化,自动做出相应的变化.
如果模型某个属性发生变化,视图也会依照变化重新渲染显示.
7.当事件循环,通常执行在顶层$scope 对象上(也就是 $rootScope) 每个作用域都执行自己的脏值检查,每个监控函数都会检查变化,如果检查到任意变化,$scope对象就会触发指定的毁掉函数.
8.模块可以让我们避免全局变量污染,
不同应用之间复用代码
9.模块定义:模块名称,依赖列表
angular.module('myApp', []);
10.$scope 作用域和数据模型息息相关,同时也是表达式执行的上下文,
作用:定义应用业务逻辑和控制器方法以及视图属性.
是素有视图的唯一源头,可以理解成视图模型.
11.作用域提供了监视数据模型变化的能力(作用域会提供观察者监视模型的变化).
12.允许开发者使用其中的 apply 机制,将数据模型的变化在整个应用范围内进行通知(甚至可以通知到系统外的组件)
可以嵌套,隔离业务功能和数据.
13.给表达式提供运算时所需的执行环境.
14.最好的架构:将应用业务逻辑都放在控制器上,将相关数据都放在控制器作用域中.
15. $rootScope 是所有 $scope 对象的最上层.
$rootScope 是 Angular.js中类似于全局作用域的对象,
$scope 类似于的 全局变量里面的 子作用域,业务逻辑写到这里面不会污染全局作用域对象.
16.angular.js的这种模式非常像 javascript中的原型继承,根据变量首先查找当前作用域是否存在.
如果找不到就去父作用域中查找,如果找不到,逐渐向上查找其父作用域,知道根作用域 $rootScope
17.ng-controller 可以直接在dom上创建一个控制器.
这个新的 $scope对象,其实就是一个子作用域.它嵌套在父作用域 $rootScope 之内.
18.当angular.js 关心的事件发生时,angular.js 就会监控应用程序内的多有对象,脏值检测循环等.
那么什么事件是 angular.js 关心的呢? 比如 绑定了 ng-model 的输入框文本变化时,绑定了 ng-click的按钮被点击时 等
angular.js 中的作用域 数据模型 控制器的更多相关文章
- 聊一下JS中的作用域scope和闭包closure
聊一下JS中的作用域scope和闭包closure scope和closure是javascript中两个非常关键的概念,前者JS用多了还比较好理解,closure就不一样了.我就被这个概念困扰了很久 ...
- 秒味课堂Angular js笔记------Angular js中的工具方法
Angular js中的工具方法 angular.isArray angular.isDate angular.isDefined angular.isUndefined angular.isFunc ...
- JS中的作用域以及全局变量的问题
一. JS中的作用域 1.全局变量:函数外声明的变量,称为全部变量 局部变量:函数内部使用var声明的变量,称为局部变量在JS中,只有函数作用域,没有块级作用域!!!也就是说,if/for等有{}的结 ...
- (网页)Angular.js 中 copy 赋值与 = 赋值 区别
转自st.gg Angular.js 中 copy 赋值与 = 赋值 区别 为什么用 $scope.user = $scope.master; $scope.master 会跟着 $scope.use ...
- angular.js 中同步视图和模型数据双向绑定,$watch $digest $apply 机制
Angular.js 中的特性,双向绑定. 让视图的改变直接反应到数据中,数据的改变又实时的通知到视图,如何做到的? 这要归功于 scope 下面3个重要的方法: $watch $digest $ap ...
- Angular.js中处理页面闪烁的方法详解
Angular.js中处理页面闪烁的方法详解 前言 大家在使用{{}}绑定数据的时候,页面加载会出现满屏尽是{{xxx}}的情况.数据还没响应,但页面已经渲染了.这是因为浏览器和angularjs渲染 ...
- 在Angular.js中的H5页面调用Web api时跨域问题处理
/// <summary> /// 被请求时 /// 在Angular.js中的H5页面调用Web api时跨域问题处理 /// </summary> /// <para ...
- 【详解】JS中的作用域、闭包和回收机制
在讲解主要内容之前,我们先来看看JS的解析顺序,我们惯性地觉得JS是从上往下执行的,所以我们要用一个变量来首先声明它,来看下面这段代码: alert(a); var a = 1; 大家觉得这段代码有什 ...
- Angular JS 中的服务注册方法
在Angular JS中创建服务的几种方法 factory() service() constant() value() provider() factory(name,fn(){}) 该服务为单例的 ...
随机推荐
- C++中无法解析的外部符号错误
在编译C++程序的时候,如果引用了对应的头文件,但是调用一个函数的时候仍然出现" 无法解析的外部符号错误"的编译错误,比如: 无法解析的外部符号__imp__PathFileE ...
- ZH奶酪:JavaScript清空数组的三种方法
参考链接:http://snandy.iteye.com/blog/893955 方式1,length赋值为0 目前 Prototype中数组的 clear 方法和mootools库中数组的 empt ...
- Struts2(五)Action二配置
一.method参数 action package com.pb.web.action; public class HourseAction { public String add(){ System ...
- 触发器五(建立INSTEAD OF触发器)(学习笔记)
INSTEAD OF触发器 对于简单视图,可以直接执行INSERT,UPDATE和DELETE操作但是对于复杂视图,不允许直接执行INSERT,UPDATE和DELETE操作.为了在具有以上情况的复杂 ...
- Spring -- 三种配置方式
1.Explicit configuration in XML:显示的XML配置. 优点: 1)XML配置方式进一步降低了耦合,使得应用更加容易扩展,即使对配置文件进一步修改也不需要工程进行修改和重新 ...
- 寻找SQL注入点
如果要对一个网站进行SQL注入攻击,首先就需要找到存在SQL注入漏洞的地方,也就是寻找所谓的注入点.可能的SQL注入点一般存在于登录页面.查找页面或添加页面等用户可以查找或修改数据的地方. 最常用的寻 ...
- Java 基础【11】.class getClass () forName() 详解
类名.class是Class对象的句柄,每个被加载的类,在jvm中都会有一个Class对象与之相对应. 如果要创建新的对象,直接使用Class对象的局部class.forName就可以了,不需要用ne ...
- java上传excel文件及解析
java上传excel文件及解析 CreateTime--2018年3月5日16:25:14 Author:Marydon 一.准备工作 1.1 文件上传插件:swfupload: 1.2 文件上 ...
- oracle tnsnames.ora文件用法说明
oracle tnsnames.ora文件用法说明 CreationTime--2018年8月10日08点32分 Author:Marydon 1.用途 oracle客户端所需要的一个文件,通过该 ...
- 基于LumiSoft.Net.dll发、收、删邮件
发邮件: using LumiSoft.Net.SMTP.Client; Mime m = new Mime(); MimeEntity mainEntity = m.MainEntity; // F ...