1.3 视图数据模型:$scope

  • $scope 是用来视图和数据之间的胶水、粘合剂
  • 视图和控制器之间的数据桥梁
  • 用于在视图和控制器之间传递数据
  • 用来暴露数据模型(数据、行为)
  • 监视模型数据的变化,做出相应的动作 $scope.$watch

如何设计 $scope

根据原型抽象数据和行为:

  • 数据
  • 行为

ViewModel

ng 官方把自己定义为一个 MVC 框架。

很多开发使用者把它称之为 MVVM 框架。

  • $scope 实际上就是 MVVM 中所谓的 VM(视图模型)
  • 正式因为 $scope 在 ng 中大量使用甚至盖过了 c 的概念,所以很多人把 ng 称之为 mvvm 框架
  • 这一点倒是无所谓

数据模型作用域

angular学习(三)-- $scope的更多相关文章

  1. angular学习笔记(三十一)-$location(2)

    之前已经介绍了$location服务的基本用法:angular学习笔记(三十一)-$location(1). 这篇是上一篇的进阶,介绍$location的配置,兼容各版本浏览器,等. *注意,这里介绍 ...

  2. angular学习笔记(三十一)-$location(1)

    本篇介绍angular中的$location服务的基本用法,下一篇介绍它的复杂的用法. $location服务的主要作用是用于获取当前url以及改变当前的url,并且存入历史记录. 一. 获取url的 ...

  3. angular学习笔记(三十)-指令(10)-require和controller

    本篇介绍指令的最后两个属性,require和controller 当一个指令需要和父元素指令进行通信的时候,它们就会用到这两个属性,什么意思还是要看栗子: html: <outer‐direct ...

  4. angular学习笔记(三十)-指令(7)-compile和link(2)

    继续上一篇:angular学习笔记(三十)-指令(7)-compile和link(1) 上一篇讲了compile函数的基本概念,接下来详细讲解compile和link的执行顺序. 看一段三个指令嵌套的 ...

  5. angular学习笔记(三十)-指令(7)-compile和link(1)

    这篇主要讲解指令中的compile,以及它和link的微妙的关系. link函数在之前已经讲过了,而compile函数,它和link函数是不能共存的,如果定义了compile属性又定义link属性,那 ...

  6. angular学习笔记(三十)-指令(6)-transclude()方法(又称linker()方法)-模拟ng-repeat指令

    在angular学习笔记(三十)-指令(4)-transclude文章的末尾提到了,如果在指令中需要反复使用被嵌套的那一坨,需要使用transclude()方法. 在angular学习笔记(三十)-指 ...

  7. angular学习笔记(三十)-指令(5)-link

    这篇主要介绍angular指令中的link属性: link:function(scope,iEle,iAttrs,ctrl,linker){ .... } link属性值为一个函数,这个函数有五个参数 ...

  8. angular学习笔记(三十)-指令(1)-概述

    之前在 angular学习笔记(十九)-指令修改dom 里面已经简单的提到了angular中的指令,现在来详细的介绍 '指令' 一.指令的创建: dirAppModule.directive('dir ...

  9. AngularJs学习笔记--Scope

    原版地址:http://code.angularjs.org/1.0.2/docs/guide/scope 一.什么是Scope? scope(http://code.angularjs.org/1. ...

  10. AngularJS系统学习之Scope(作用域)

    本文出自:https://www.w3ctech.com/topic/1611 看完了没怎么懂,  也许是和别人 原文作者: Nicolas Bhttps://www.w3ctech.com/topi ...

随机推荐

  1. laravel blade模板介绍

    第一步:首先写好模板 在sites下新建立一个app.blade.php文件 写入模板如: <!DOCTYPT html><html><head> <titl ...

  2. div自身高度、屏幕高度

    获取元素高度 scrollWidth    //显示当前元素的宽度 scrollHeight   //显示当前元素的高度 scrollLeft     //显示当前元素的左边距左侧的距离 scroll ...

  3. 弹出浮层css+JQuery

    先来张效果图: HTML代码如下: <body> <div class="bg" id="bg" style="display: n ...

  4. 编写高质量代码改善程序的157个建议:第87个建议之区分WPF和WinForm的线程模型

    今天有时间了,继续<编写高质量代码改善程序的157个建议>的阅读,当我阅读到建议87的时候,里面的一些代码示例和文中所说的不一致了,是不是我现在用的是NetFramework 4.0的缘故 ...

  5. JavaScript从入门到忘记

    JavaScript是一门编程语言,浏览器内置了JavaScript语言的解释器,所以在浏览器上按照JavaScript语言的规则编写相应代码之,浏览器可以解释并做出相应的处理. 一.如何编写 二.变 ...

  6. 关于Latex中插入Visio图片文字不显示的问题

    经过探索,将Visio保存为pdf格式是最完美的解决方式,因为pdf文件保存了所有格式和字体信息. Visio输出pdf时要使其符合PDF/A标准.如果包含Visio的多余信息,就会在一些低版本Lat ...

  7. (转载)基于Bash命令行的百度云上传下载工具

    原文链接:http://hi.baidu.com/meoow/item/aef5814bbd5be3e1bcf451e9 这是我根据百度云PCS的API写的一个基于bash的命令行工具, 使用了cur ...

  8. DOM元素拖拽效果

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  9. 使用JS开发桌面端应用程序NW.js-2-开发问题小记

    前言 本文为开发nw中遇到的各种问题,仅以记录供备忘以及遇到相同问题的人的一点点解决思路. 1. package.json中的window字段无效 原因:package.json中的window字段, ...

  10. Unreal Engine 4 Radiant UI 插件入门教程(二)

    本篇章前提要求:在UE4上安装了Radiant UI插件.如果没有安装,请找其它教程(或者是笔者的其它的教程,目前正在写). 本教程的目的:探讨如何从网页元素中调用蓝图中的内容: 第一步: 写一个网页 ...