用AngularJS开发下一代Web应用

作者：格林

页数：204

出版社：电子工业出版社

出版日期：2013

ISBN：9787121215742

电子书格式：pdf/epub/txt

内容简介

AngularJS是一款来自Google的前端JS框架,它的核心特性有:MVC、双向数据绑定、指令和语义化标签、模块化工具、依赖注入、HTML模板,以及对常用工具的封装,例如$http、$cookies、$location等。AngularJS框架的体积非常小,但是设计理念和功能却非常强大,值得前端开发者深入学习。 本书对AngularJS框架的核心特性做了全面的介绍,包括常用的开发工具和开发环境。作为国内第一本关于AngularJS的书籍,本书是学习AngularJS的第一入门工具。

作者简介

Brad Green是Google公司AngularJS项目的技术经理。他同时还直接负责可访问性和技术支持方面的工作。 Shyam Seshadri是Fundoo Solutions公司的老板兼CEO,同时经营AngularJS商店,并且致力于为印度市场提供创造性和有趣的产品。

本书特色

我们都希望开发更小型、更轻量的Web应用,让创建应用更加容易,并且当项目变大时仍然易于测试、扩展和维护。这本手册将为你介绍AngularJS,它是一个开源的JavaScript框架,它使用MVC架构、数据绑定、客户端模板以及依赖注入等技术,从而为构建Web应用创建急需的结构。 本书的作者是两位在Google负责AngularJS框架的工程师,他们将引领读者概览整个框架的核心特性,并构建一款可运行的AngularJS应用,内容涵盖布局、测试、编译及调试整个过程。通过这个过程,你将会学到AngularJS是怎样降低Web应用复杂性的。

■ 深入理解Angular的构件,学习它们是如何协同工作的。

■ 使用MVC模式分离控制逻辑、数据以及渲染职责,从而获得最大程度的灵活性。

■ 利用客户端模板在浏览器中装配你的完整应用。

■ 利用AngularJS的指令,用声明式语法来扩展HTML。

■ 使用$http服务与服务器交互并实现简单的缓存。

■ 利用依赖注入改进重构、测试以及多种环境下的设计。

■ 获得Web应用中常见问题的代码示例。

目录

前言

关于Angular 的起源，我可以追溯到2009 年的Google Feedback 项目。当时，对于项目的开发速度以及如何编写可测试代码的问题，我们已经经受了几个月的折磨。6 个月时，我们开发了差不多17000 行前端代码。这时候，团队中的一个成员Misko Hevery 做出了一个大胆的宣言：利用他自己业余时间所开发的一个开源库，他可以在两周之内把目前所有东西重写一遍。

我当时想，两周的时间并不会给我们造成太大的影响，同时我们也接受了Misko 努力构建一些东西的想法。然而Misko 最终还是估算错了时间，他用了三个星期。但是，我们所有人还是被他深深地震撼了，更让我们感到震撼的是，他所开发的新应用的代码量从原来的17000 行压缩到了1500 行。看起来，Misko 的东西值得深入推广。Misko 和我决定，围绕他所提倡的理念组建一个团队，这个简单的理念就是：简化对web 开发者的经验要求。Shyam Seshadri，也就是本书的合著者，后来继续领导GoogleFeedback 团队开发了第一款搭载Angular 的应用。

从那时起，我们在大家的指导下继续开发Angular。给予我们指导的人有的来自Google自己的团队，也有来自全球的数以百计的开源贡献者。数千名开发者在他们的日常工作中依赖Angular，并且发展成了一个优质的支持者网络。

我们也非常期望能够接受你的指导。

排版约定

在本书中将会使用以下排版和印刷约定。

斜体（Italic）

表示新的术语、URL、邮箱地址、文件名以及文件的扩展名。

等宽字体（Constant width）

用于代码清单，以及段落中所引用的编程元素，例如变量、函数名称、数据库、数据类型、环境变量名称、语句以及关键字。

等宽加粗字体（Constant width bold）

用于显示需要用户输入的文本字面值，例如命令或者文本。

等宽斜体（Constant width italic）

用于显示应该被替换的文本，这些文本会被用户所输入的值或根据上下文所决定的值所替换。

使用实例代码

本书的目标是帮助你完成工作。总地来说，你完全可以将本书中所包含的实例代码用在你的程序和文档中。你没有必要联系我们来获得授权，除非你想对代码做出大规模的重构。举例来说，如果你编写一个程序，里面将会使用几段来自本书中的代码，这种行为并不需要获得授权；而出售或者分发O’Reilly 书籍中实例代码的CD-ROM 就需要获得授权；引用本书中的内容或者本书中的实例代码来回答问题不需要授权；而把本书中的大量代码合并到你的产品文档中就需要授权。

节选

2.在表单输入项上使用ng -model。与表达式类似，ng-model上指定的模型参数同样工作在外层控制器内。唯一的不同点在于，这样会在表单项和指定的模型之间建立双向绑定关系。

使用$watch监控数据模型的变化

在scope内置的所有函数中，用得最多的可能就是$watch函数了，当你的数据模型中某一部分发生变化时，$watch函数可以向你发出通知。你可以监控单个对象的属性，也可以监控需要经过计算的结果（函数），实际上只要能够被当作属性访问到，或者可以当作一个JavaScript函数被计算出来，就可以被$watch函数监控。它的函数签名为$watch（watchFn， watchAction， deepWatch）其中每个参数的详细含义如下。

watchFn

该参数是一个带有Angular表达式或者函数的字符串，它会返回被监控的数据模型的当前值。这个表达式将会被执行很多次，所以你要保证它不会产生其他副作用。也就是说，要保证它可以被调用很多次而不会改变状态。基于同样的原因，监控表达式应该很容易被计算出来。如果你使用字符串传递了一个Angular表达式，那么它将会针对调用它的那个作用域中的对象而执行。

watchAction

这是一个函数或者表达式，当watchFn发生变化时会被调用。如果是函数的形式，它将会接收到watchFn的新旧两个值，以及作用域对象的引用。其函数签名为function（newValue， oldValue， scope）。

deepWatch

如果设置为true，这个可选的布尔型参数将会命令Angblar去检查被监控对象的每个属性是否发生了变化。如果你想要监控数组中的元素，或者对象上的所有属性，而不只是监控一个简单的值，你就可以使用这个参数。由于Angular需要遍历数组或者对象，如果集合比较大，那么运算负担就会比较重。

$watch函数会返回一个函数，当你不再需要接收变更通知时，可以用这个返回的函数注销监控器。

……