angular学习笔记系列一
首先我们要明确一点,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学习笔记系列一的更多相关文章
- MongoDB学习笔记系列
回到占占推荐博客索引 该来的总会来的,Ef,Redis,MVC甚至Sqlserver都有了自己的系列,MongoDB没有理由不去整理一下,这个系列都是平时在项目开发时总结出来的,希望可以为各位一些帮助 ...
- Dynamic CRM 2013学习笔记 系列汇总
这里列出所有 Dynamic CRM 2013学习笔记 系列文章,方便大家查阅.有任何建议.意见.需要,欢迎大家提交评论一起讨论. 本文原文地址: Dynamic CRM 2013学习笔记 系列汇总 ...
- SQLServer学习笔记系列3
一.写在前面的话 今天又是双休啦!生活依然再继续,当你停下来的时候,或许会突然显得不自在.有时候,看到一种东西,你会发现原来在这个社会上,优秀的人很多,默默 吃苦努力奋斗的人也多!星期五早上按时上班, ...
- SQLServer学习笔记系列2
一.写在前面的话 继上一次SQLServer学习笔记系列1http://www.cnblogs.com/liupeng61624/p/4354983.html以后,继续学习Sqlserver,一步一步 ...
- Dynamic CRM 2015学习笔记 系列汇总
这里列出所有 Dynamic CRM 2015学习笔记 系列文章,方便大家查阅.有任何建议.意见.需要,欢迎大家提交评论一起讨论. 本文原文地址:Dynamic CRM 2015学习笔记 系列汇总 一 ...
- 步步为营 SharePoint 开发学习笔记系列总结
转:http://www.cnblogs.com/springyangwc/archive/2011/08/03/2126763.html 概要 为时20多天的sharepoint开发学习笔记系列终于 ...
- WebService学习笔记系列(二)
soap(简单对象访问协议),它是在http基础之上传递xml格式数据的协议.soap协议分为两个版本,soap1.1和soap1.2. 在学习webservice时我们有一个必备工具叫做tcpmon ...
- .NET CORE学习笔记系列(2)——依赖注入[7]: .NET Core DI框架[服务注册]
原文https://www.cnblogs.com/artech/p/net-core-di-07.html 包含服务注册信息的IServiceCollection对象最终被用来创建作为DI容器的IS ...
- .NET CORE学习笔记系列(2)——依赖注入[6]: .NET Core DI框架[编程体验]
原文https://www.cnblogs.com/artech/p/net-core-di-06.html 毫不夸张地说,整个ASP.NET Core框架是建立在一个依赖注入框架之上的,它在应用启动 ...
随机推荐
- JAVA中传递的值还是引用的问题
public static void main(String[] args) { /*byte b[] = new byte[1024*1024*50]; System.out.println(b); ...
- qt——QFileDialog使用对话框选取本地文件
QT在学习的过程中总是遇到各种问题,没有人解答,只有自己在研究并且在网上搜索一些资料,从初学到现在入门,一直都是这样走过来的,虽然走得很艰难,但是每一个阶段都会有所收获,最近在做一个图片浏览模块的功能 ...
- Ubuntu操作异常汇总
1.使用Ubuntu的apt-get安装软件时出现以下错误: Reading package lists... Done Building dependency tree... Done Packag ...
- arguments参数对象
//求任意个数的和 function test() { var sum = 0; for (var i = 0; i < arguments.length; i++) { sum += argu ...
- 为什么要用Zero-Copy机制?
考虑这样一种常用的情形:你需要将静态内容(类似图片.文件)展示给用户.那么这个情形就意味着你需要先将静态内容从磁盘中拷贝出来放到一个内存buf中,然后将这个buf通过socket传输给用户,进而用户或 ...
- python 解析xml遇到xml.etree.ElementTree.ParseError: not well-formed (invalid token): line 4, column 34
在调试数字驱动用xml文件的方式时,包含读取xml文件的步骤,运行程序报错: d:\test\0629>python XmlUtil.pyTraceback (most recent call ...
- 20145325张梓靖 《Java程序设计》第6周学习总结
20145325张梓靖 <Java程序设计>第6周学习总结 教材学习内容总结 串流设计 输入串流(将数据从来源取出),代表对象为java.io.InputStream实例,输出串流(将数据 ...
- impress.js初体验——前端装X利器
impress.js 是国外一位开发者受 Prezi 启发,采用 CSS3 与 JavaScript 语言完成的一个可供开发者使用的表现层框架(演示工具).其功能包括画布的无限旋转与缩放,任意角度放置 ...
- RabbitMQ 流程以及一些命令
流程: producer&Consumer producer指的是消息生产者,consumer消息的消费者. Queue 消息队列,提供了FIFO的处理机制,具有缓存消息的能力.rabbitm ...
- VS2012 QT程序打包部署详解
1.设置安装程序集 InstallShield安装完成后,执行以下步骤右键解决方案-->添加-->新建项目-->其他项目类型-->安装和部署,具体操作如下图: 2.发布程序 在 ...