首先我们要明确一点，angular在web应用的角色，在传统的多页面web应用程序中，服务器根据输出数据和html模板渲染好页面所需的html输出到页面(所谓的服务器装配程序)，随着单页面应用程序和ajax化的流行，页面应用程序开始利用ajax技术实现局部刷新的页面体验和快速响应的效果；但是这一切或是大多是的html渲染都是服务器来处理（当然也有各种js模板技术实现在客户端组装数据），每次发送的html片段会根据数据量的多少变化。 angular实现了服务器只需要将数据和html模板片段输出到客户端，让客户端进行装配数据，即减少了服务器cpu时间，又及大的降低了单次响应页面的大小。

再说关于mvc，传统的mvc被广泛的应用在c++/java/php/net等后端技术，由于前端技术不断的发展，js由单一的提交表单到大量应用于校验、与服务器通讯和各种提高体验等场景的应用而被不断的完善。它不在是浏览器上的一个小特性，而是一门流行的网站脚本语言（当然js也包括服务器开发场景nodejs，只不过我们熟知的场景多应用于网站开发），因此angular的应用中将前端代码引入了mvc（当然它不是第一个基于mvc的前端框架，例如ember也采用mvc，类似的基于事件监听、依赖注入和数据绑定的方式工作），angular中view层是html片段，Controller则是javascript类（在js中可以是function的体现也可以是angular中控制器的实现），model被存储在($scope)对象的属性中

引入三个新词汇

　　1、数据绑定：把UI中部分需要变更dom映射到js属性上，让他们根据更改自动同步到显示界面的过程

　　　　

<html ng-app><!--如果需要angular解析应用，必须加入ng-app，不过根据angular需要操作的html片段可以选择写在其他标签内-->

<script src="js/angular.js"></script>

<script>

    function databinding($scope) {

        $scope.say = 'hello';

    }

</script>

<body>

    <div ng-controller="databinding">

        <input type="text" ng-model="say">

        <span>{{say}}, world</span>

    </div>

</body>

</html>

2、依赖注入：给一个对象传入一个实例，并对该实例进行操作(http://www.cnblogs.com/xingyukun/archive/2007/10/20/931331.html)

　　3、指令：angular内置了很多非html规范中的属性，来实现数据绑定、视图和控制器的功能，以ng-开头

angular学习笔记系列一的更多相关文章

  1. MongoDB学习笔记系列

    回到占占推荐博客索引 该来的总会来的,Ef,Redis,MVC甚至Sqlserver都有了自己的系列,MongoDB没有理由不去整理一下,这个系列都是平时在项目开发时总结出来的,希望可以为各位一些帮助 ...

  2. Dynamic CRM 2013学习笔记 系列汇总

    这里列出所有 Dynamic CRM 2013学习笔记 系列文章,方便大家查阅.有任何建议.意见.需要,欢迎大家提交评论一起讨论. 本文原文地址: Dynamic CRM 2013学习笔记 系列汇总 ...

  3. SQLServer学习笔记系列3

    一.写在前面的话 今天又是双休啦!生活依然再继续,当你停下来的时候,或许会突然显得不自在.有时候,看到一种东西,你会发现原来在这个社会上,优秀的人很多,默默 吃苦努力奋斗的人也多!星期五早上按时上班, ...

  4. SQLServer学习笔记系列2

    一.写在前面的话 继上一次SQLServer学习笔记系列1http://www.cnblogs.com/liupeng61624/p/4354983.html以后,继续学习Sqlserver,一步一步 ...

  5. Dynamic CRM 2015学习笔记 系列汇总

    这里列出所有 Dynamic CRM 2015学习笔记 系列文章,方便大家查阅.有任何建议.意见.需要,欢迎大家提交评论一起讨论. 本文原文地址:Dynamic CRM 2015学习笔记 系列汇总 一 ...

  6. 步步为营 SharePoint 开发学习笔记系列总结

    转:http://www.cnblogs.com/springyangwc/archive/2011/08/03/2126763.html 概要 为时20多天的sharepoint开发学习笔记系列终于 ...

  7. WebService学习笔记系列（二）

    soap(简单对象访问协议),它是在http基础之上传递xml格式数据的协议.soap协议分为两个版本,soap1.1和soap1.2. 在学习webservice时我们有一个必备工具叫做tcpmon ...

  8. .NET CORE学习笔记系列(2)——依赖注入[7]: .NET Core DI框架[服务注册]

    原文https://www.cnblogs.com/artech/p/net-core-di-07.html 包含服务注册信息的IServiceCollection对象最终被用来创建作为DI容器的IS ...

  9. .NET CORE学习笔记系列(2)——依赖注入[6]: .NET Core DI框架[编程体验]

    原文https://www.cnblogs.com/artech/p/net-core-di-06.html 毫不夸张地说,整个ASP.NET Core框架是建立在一个依赖注入框架之上的,它在应用启动 ...

随机推荐

  1. [Axiom 3D]2.Axiom 基本概念

    1.Root Root 对象是一个 Ogre 应用程序的主入口点.因为它是整个 Ogre 引擎的外观(Façade )类(请参考设计模式中的外观模式),所以在这里作为第一个被列出来的类,它提供了方便的 ...

  2. EasyUI Tooltip 提示框

    通过 $.fn.tooltip.defaults 重写默认的 defaults. 当用户移动鼠标指针在某个元素上时,出现提示信息窗口用来显示额外信息.提示内容可以包含任何来自页面的或者通过 ajax ...

  3. python拼接字符串

    python拼接字符串一般有以下几种方法: 1.直接通过(+)操作符拼接 s = 'Hello' + ' ' + 'World' + '!' print(s) 输出结果:Hello World! 使用 ...

  4. Windows mysql默认字符集修改

    一.通过MySQL命令行修改: set character_set_client=utf8; set character_set_connection=utf8; set character_set_ ...

  5. Django REST framework 之JWT认证

    Json Web Token 1.JWT简介 JWT 是一个开放标准(RFC 7519),它定义了一种用于简洁,自包含的用于通信双方之间以 JSON 对象的形式安全传递信息的方法.JWT 可以使用 H ...

  6. 2018-2019 ACM-ICPC, Asia Seoul Regional Contest

    ProblemA Circuits Solved. 题意: 有$n$个矩形,可以放两条平行与$x$轴的线,求怎么放置两条无线长的平行于$x$轴的线,使得他们与矩形相交个数最多 如果一个矩形同时与两条线 ...

  7. 远程连接软件TeamViewer

    (1)先在windows下安装Teamviewer软件,地址:https://pan.baidu.com/s/1rWxRBtNbn3OMmg-8YaYWRQ (2)再在linux下安装Teamview ...

  8. 图像处理（二十一）基于数据驱动的人脸卡通动画生成-Siggraph Asia 2014

    http://blog.csdn.net/garfielder007/article/details/50582018 在现实生活中,我们经常会去评价一个人,长得是否漂亮.是不是帅哥美女,然而如何用五 ...

  9. TED #01#

    Laura Vanderkam: How to gain control of your free time 1.我们总是不缺乏时间去做重要的事情,即便我们再忙; “我没时间” 的同义词是“我不想做” ...

  10. php-fpm开启报错-ERROR: An another FPM instance seems to already listen on /tmp/php-cgi.sock

    在升级了php7.2.0版本之后,重新启动php-fpm过程中遇到一个报错. An another FPM instance seems to already listen on /tmp/php-c ...