作者：(美)Ari Lerner
出版社：人民邮电出版社
格式: AZW3, DOCX, EPUB, MOBI, PDF, TXT
AngularJS权威教程试读：
译者序
2012年上半年，我所在的公司正在开发一个二次开发平台，它的目标是从数据库开始，能自由、方便地定制业务数据、规则、流程、服务接口，还有展现层。在对展现层的实现部分，我思考了很久，对其中部分技术细节还是缺乏好的思路，于是把眼光转到开源社区，无意中发现了AngularJS这样一个框架，详细考察之后，我认为它在很大程度上满足了我们的需求，继而投入了不小的精力进行研究。
在这两年里，我差不多遍历了它的源码，了解了很多细节的实现机制，并且与当时研究得较深的几位朋友，比如angularjs.cn的作者严清，资深开发者王宇鹏等进行了交流，获得了很多有益的信息，与此同时，也跟Avalon的作者司徒正美有过一些讨论，对前端MV*有了更深入的认识。
后来，团队中的大漠穷秋翻译的《用AngularJS开发下一代Web应用》由电子工业出版社出版。作为国内第一本关于AngularJS的译著，它带动了学习和了解AngularJS框架的浪潮，也因此与朴灵的《深入浅出Node.js》一起，成为前端开发人员拓展思维和技能的两本最受欢迎图书。
到了2014年，我离开工作9年的地方，来到新的工作环境——苏宁云商，本来心里权衡过，很可能不再有使用AngularJS的业务场景了，不曾想到入职之后面对的几个项目都属于云产品，正适合使用这类框架，因此又继续了对它的深入研究。
在此期间，图灵公司的李松峰老师发布了本书招募译者的消息，我心里一动就联系了他。经过沟通之后，我与另外两名译者，豌豆荚的@赵望野和腾讯的@basecss，合作翻译本书，每人负责1/3的内容。第一次正式翻译图书，我很忐忑，翻译过程中也遇到了一些困难。此前我虽翻译过一些技术文章，其中一篇恰好与AngularJS有关，但翻译图书跟翻译文章的差异很大，有很多东西要考虑一致性和连贯性。
本书内容丰富，从零开始向读者讲述AngularJS，首先介绍AngularJS的基本概念，以及在一些场景下的简单应用。接着，本书花很大篇幅讲解AngularJS的周边体系。我们使用这样一个框架，自然需要对前端的架构有一些考虑，包括代码的组织，一些第三方库的选择，甚至还有项目的建立、开发、测试、发布等各环节的综合考虑，这不再是一个简单的编码过程，而是一整套工程化的流程。
另外，我们也可能需要为这样一套前端的技术栈选择相应的后端服务，比如，可以使用Node.js自己建立，或者是利用互联网上已有的一些强大平台（比如Amazon等），在这些平台的帮助下，我们的AngularJS应用将如虎添翼，到达新的高度。
使用一个框架却不去深入了解它的原理，就会一直流于表面，当面对比较复杂的场景时，就不到优化方案。因此，本书的后面部分也深入剖析了AngularJS的一些原理和拓展主题，比如国际化、移动开发、调试、性能优化等。
无论是零基础的入门级开发者，还是有过一定经验的中高级开发人员，都能从本书中受益。
目前，前端MV*框架百花齐放，AngularJS只是其中较流行的一种。这些框架孰优孰劣，其实并无定论，每个框架都会有它的适用场景，都有它优秀的一面，也没有哪个框架能够通吃所有业务场景，如果因为对一个框架的喜爱，而把它引入到不适合的产品中，一定是有害无益。
因此，我们希望读者在阅读本书时，能够多思考，愿大家在学习本书过程中都能收获满满。这样的话，作为本书译者的我们也将感同身受，与大家一同分享其中的喜悦和满足感。
在本书的出版过程中，除了我们三名译者之外，图灵公司的编辑李静也付出了很大的努力，支付宝的玉伯、51JS版主宝玉、百度的berg提出了不少宝贵意见，对此，一并表示衷心感谢。徐飞2014年7月
何鹏飞的个人致谢
感谢我所在的团队，给我提供非常好的环境，让我能学习成长。
感谢我在腾讯的导师@TooBug，让我接触到很多新东西，当然包括这本书所讲述的AngularJS。在翻译的过程中他也为我提供了很多帮助。
感谢图灵公司的出版团队，本书的出版离不开他们的努力和帮助。
最后，还要感谢没有在这里一一列出的帮助过我的每一个人。
赵望野的个人致谢
Web技术日新月异，每天早上翻看各种技术博客，都有一种逆水行舟不进则退的危机感，而这两年来前端MV*框架无疑是Web前端开发领域最热门的话题之一。之前已经读过本书英文版，其中涵盖了AngularJS开发的全部细节，示例代码清晰易懂，因此接下了中文版的翻译工作，并迫不及待地推荐给所有想学习AngularJS的朋友。感谢李松峰老师的帮助，感谢图灵出版团队的辛勤工作，感谢在翻译本书过程中给予帮助的所有朋友。
引言
序似乎每天都有新的JavaScript库或框架发布，对此我多少已经有些麻木了。有能力从众多的库或框架中进行筛选是件好事，但至少在我看来，一个应用程序中如果包含了太多的脚本，对于维护来说却是件坏事。随着应用程序中脚本数量的增加，脚本间会产生依赖关系，所以我一直期待能有那么一到两个脚本，就提供我需要的所有核心功能。
当我第一次听说AngularJS时，它就立刻引起了我的注意，因为它只通过一个独立的框架就可以构建动态、交互密集型的客户端应用。通过进一步的研究，我确信这个第一判断是正确的，于是开始迷上了这个框架。AngularJS提供了一系列健壮的功能，以及将代码隔离成模块的方法，这对提高可复用性、可维护性和可测试性都是非常有益的。它的核心功能包括DOM操作、动画、模板、双向数据绑定、路由、历史管理、Ajax和测试，等等。
基于一个核心框架进行开发虽然很方便，但是学习它却充满挑战。一开始学习AngularJS时，我迷失在各种不同的主题中，并很快变得有些沮丧，甚至开始怀疑它到底是不是我想要的。服务是什么？它和工厂相比有什么区别？作用域服务是怎么同整个系统融合在一起的？指令是什么，我为什么要使用它？将这些零碎的知识点拼在一起形成大局观是我最初要克服的障碍。如果能有一些简明的参考资料，对于降低学习难度大有裨益。
很幸运，你已经有了这样一本优秀的参考资料，就是你手上的这本《AngularJS权威教程》，它将帮助你提升学习效率。本书作者将他掌握的AngularJS知识倾囊相授，并以非常容易理解和学习的方式呈现给大家。如果你想更深入地了解数据绑定、实时模板的工作原理、测试AngularJS应用的流程、服务和工厂的作用以及作用域和控制器如何协同工作等知识，那么这本书就是你所需要的。使用功能强大的AngularJS进行开发是一件非常有趣的事情，本书的示例将帮助你快速掌握这个框架。祝你的AngularJS项目一切顺利！Dan Wahlin，瓦林咨询公司致谢
首先，我要感谢一直鼓励我完成这本书的每一个人。那些说写书很容易的人，一定没有亲自写过。
我还要亲自感谢Q Kuhns对本书语法方面不厌其烦的修改和支持，感谢Erik Trom耐心地对细节进行修订，以及Nate Murray的清晰思路和乐观精神。
非常感谢Hack Reactor的全体成员在2013年的暑期课程中给了我一个探索如何在正式场合讲授AngularJS的机会。
同时也要感谢我在30x500的校友们，Sean Iams、Michael Fairchild、Bradly Green、Misko Hevery和整个AirPair团队。
最后，感谢那些对这本书的预览版提供帮助的人。我们从社区获得了非常棒的帮助和支持。特别要感谢以下三位：
●Philip Westwell
●Saurabh Agrawal
●Dougal MacPherson关于本书
本书包含了能让你成为AngularJS高手的解决方案。AngularJS是由Google开发的先进前端框架，借助它你可以快捷高效地开发富交互应用。
本书提供了一系列前沿工具，使你在很短的时间内就可以上手创建令人印象深刻的Web体验。它能帮助你解决棘手的问题，并提供了一些可以立刻投入使用的实用技术。
本书涵盖的主题可以帮助你构建专业的Web应用，并能够非常顺利地执行。这些主题包括：
●与RESTful风格的Web服务交互；
●创建可复用的自定义组件；
●测试；
●异步编程；
●创建服务；
●提供先进的视觉效果；
●其他更多内容。
本书的目标不仅是让你深刻了解AngularJS的运行原理，而且同时也提供了专业的代码片段，你可以对它们进行修改，从而构建你自己的应用。
借助这些工具和测试，你可以着手使用AngularJS开发自己的动态Web应用了，并且确信你的应用是可扩展的。本书读者对象
本书写给那些从未使用AngularJS开发过Web应用，并且对如何开始使用这个优秀的框架心存好奇的读者。我们假定读者已经掌握了HTML和CSS，并且熟悉JavaScript（或者其他JavaScript框架）的基础知识。本书组织结构
首先，本书涵盖了入门的基础知识，目的是帮助你很快上手使用AngularJS开发动态Web应用。
接下来会介绍AngularJS的工作原理，以及它与其他流行的JavaScript框架的差异。我们会深入讨论AngularJS应用内部的工作流程。
最后，我们将应用所学的知识开发一个相对复杂的应用程序。其他资源
我们会引用AngularJS官方网站的文档。官方文档是非常好的学习资源，我们会经常用到它。
建议你先看一下AngularJS的API文档，通过它，你可以直接获得开发AngularJS应用的推荐方法。同时，这个文档肯定也是最新的。本书排版约定
本书使用如下排版规范来表示不同类型的信息。
单行代码是这样的：
Hello
代码块如下所示：var app = angular.module('App', []);app.controller('FirstController', function($scope) { $scope.data = "Hello"; });
命令行中的命令如下所示：$ ls -la
Chrome（开发过程中使用的主要浏览器）开发者控制台中的命令如下所示：> var obj = {message: "hello"};
新术语使用楷体。
重点文字将会加粗。
提示和技巧用如下图标标示：这个图标表示提示。
提醒和陷阱用警告图标标示：这个图标表示警告。
错误信息用如下图标标示：这个图标表示错误。
重要的补充内容使用如下图标标示：信息框。
需要讨论的主题用如下图标标示：这是一个讨论框。开发环境
为了开发AngularJS应用，首先需要一个顺手的开发环境。在整个学习过程中，我们会将精力主要放在两个环境中：编辑器和浏览器。
本书提到编辑器时指的是你使用的文本编辑器，而浏览器就是你使用的浏览器。强烈建议你下载Google的Chrome浏览器，因为它提供了一个非常强大的开发环境，可以使用开发者工具。
开始之前，我们还需要安装一些库。为了运行测试，我们需要Karma和Node.js。最好也装上git，但不强求。
本书不会介绍如何安装NodeJS。可以访问nodejs.org来获得更多信息。
虽然我们大部分工作都是在浏览器中完成的，但本书的部分内容也会重点介绍如何在服务器端通过构建RESTful风格的API来服务前端。第1章初识AngularJS本章的目标是帮助你熟悉与AngularJS有关的一些术语和技术，以及它们背后相关的工作原理。即使以前从来没有接触过AngularJS，通过将零碎的知识点组合在一起，你也可以构建一个属于自己的AngularJS应用。1.1浏览器如何获取网页
我们把互联网想象成一个邮局：当你想给朋友写信时，首先要把内容写在一张信纸上，然后在信封上写上地址，再把信纸装进信封。
当你把信送到邮局，邮件分拣机会根据邮编和地址来判断你的朋友住在哪里。如果他住在一栋有很多房间的公寓大楼里面，邮局会把信件投递到大楼的前台，然后大楼的工作人员会根据房间号再次进行分拣。
互联网的工作原理和上面的过程很类似。不同的是，现实世界中由街道连接起来的楼房和公寓，在互联网世界中被路由器和网线连接起来的计算机所取代。每一台计算机都有一个唯一的地址，让网络可以定位到它。
多个公寓房间共享同一个街道地址，与此类似，多台计算机也可以共享同一个网络或路由器。比如，在使用星巴克提供的免费Wi-Fi时，多台计算机就会共享同一个公网IP地址。尽管如此，你的计算机依然可以通过路由器分配的内网IP地址被单独访问到，路由器就好比公寓大楼的工作人员，而内网IP地址就好比房间号。
IP是互联网协议（Internet Protocol）的缩写。IP地址是为每个接入到网络中的设备分配的数字标识符。计算机、打印机甚至手机都有自己的IP地址。
目前有IPv4和IPv6两种主要的IP地址类型，普遍使用的是IPv4地址，例如192.168.0.199这种形式，而IPv6地址是2001:0db8:0000:0000:0000:ff00:0042:8329这种形式的。
当你打开一个浏览器，并在地址栏输入http://google.com后，浏览器会“询问”网络（更准确地说，是“询问”DNS服务器）google.com对应的IP地址是什么？如果DNS服务器知道你要找的IP地址，就会将其结果返回；如果不知道，它会将请求转发给其他DNS服务器，直到在某一台DNS服务器上找到对应的IP地址记录。在终端输入下列指令，可以观察DNS服务器的响应内容：$dig google.com
如果你使用的是Mac操作系统，可以使用Terminal终端程序，它通常储存在/Applications/Utilities目录中。如果使用的是Windows操作系统，打开开始菜单，在运行中输入cmd就可以打开终端了。
DNS服务器返回了你要访问的计算机的IP地址（例如找到了google.com对应的IP地址）后，它就会向这个IP地址对应的计算机请求你要访问的页面。
每一个路径对应的网页都由不同的HTML文档组成（也有一些例外）。例如，当浏览器请求http://google.com或http://google.com/images时，得到的HTML文档是不一样的。
现在，计算机已经知道了在哪个IP地址可以访问到http://google.com，它会向Google的服务器请求显示这个页面所需的HTML。
当远程服务器把HTML文档发送回来后，浏览器会对文档进行渲染。渲染就是通过一系列操作，使HTML页面按照设计之初的既定方式显示。1.2 浏览器是什么
在介绍AngularJS之前，我们需要先了解浏览器在渲染网页的过程中都做了些什么。
目前市场上有很多不同品牌的浏览器，常见的有Chrome、Safari、Firefox和IE。它们的核心功能基本上都是相同的：获取网页，并将它显示给用户。
浏览器获取页面对应的HTML文本，将其解析为一个在浏览器内部使用的结构，对页面的内容进行布局，并在内容显示到屏幕上之前加上样式，所有这些工作都是在浏览器内部进行的。
作为Web开发人员，我们的工作是构造网页的结构和内容，这样浏览器才能将它们转化成对用户来说比较美观的形式。
使用AngularJS，不仅可以构建页面的结构，而且可以构建用户和Web应用之间的交互。1.3AngularJS是什么
AngularJS的官方文档是这样介绍它的。
完全使用JavaScript编写的客户端技术。同其他历史悠久的Web技术（HTML、CSS和JavaScript）配合使用，使Web应用开发比以往更简单、更快捷。
AngularJS主要用于构建单页面Web应用。它通过增加开发人员和常见Web应用开发任务之间的抽象级别，使构建交互式的现代Web应用变得更加简单。
AngularJS的开发团队将其描述为一种构建动态Web应用的结构化框架。
AngularJS使开发Web应用变得非常简单，同时也降低了构建复杂应用的难度。它提供了开发者在现代Web应用中经常要用到的一系列高级功能，例如：
●解耦应用逻辑、数据模型和视图；
●Ajax服务；
●依赖注入；
●浏览历史（使书签和前进、后退按钮能够像在普通Web应用中一样工作）；
●测试；
●更多功能。1.3.1 AngularJS有什么不同
在其他JavaScript框架中，我们被迫从自定义的JavaScript对象中进行扩展，并从外到内操作DOM。以jQuery为例，为了在DOM中插入一个按钮元素，我们必须知道要把元素放到何处，并在合适的位置插入它：var btn = $("");btn.on('click', function(evt) { console.log("Clicked button");});$("#checkoutHolder").append(btn);
尽管这个过程并不复杂，但是它要求开发者对整个DOM结构都有所了解，并强迫我们在JavaScript代码中加入复杂的控制逻辑，用以操作外部DOM。
而AngularJS则通过原生的Model-View-Controller（MVC，模型-视图-控制器）功能增强了HTML。结果表明，这个选择可以快捷和愉悦地构建出令人印象深刻并且极富表现力的客户端应用。
利用它，开发者可将页面的一部分封装为一个应用，并且不强迫整个页面都使用AngularJS进行开发。这个特质在某些情况下非常有用，比如你的工作流程中已经包含了另外一个框架，或者你只希望页面中的某一部分是动态的，而剩下的部分是静态的或者是由其他JavaScript框架来控制的。
此外，AngularJS团队非常重视框架文件压缩后的大小，这样使用它就不会付出太多的额外代价（写作本书时，文件压缩后的体积在90 KB左右）。这一特性使得AngularJS非常适合用于开发功能原型。1.3.2 许可
AngularJS的源码托管在GitHub上，可以免费获取。它基于MIT许可发布，这意味着你可以为AngularJS贡献代码，使其变得更加优秀。
为了促进大家为AngularJS贡献代码，开发团队把开发流程变得相对开放。任何重大变化都需要在AngularJS的邮件列表上进行讨论，所有人都可以加入讨论，这样一来大家就可以对潜在的变动进行改进，并且防止重复劳动。
关于贡献代码的更多内容可以在AngularJS的官网中查看“贡献代码”部分。第2章数据绑定和第一个AngularJS Web应用
Hello World
写一个Hello World应用是开始学习AngularJS的最基本途径，让我们从一段简单得不能再简单的HTML开始吧。
随着学习的深入，我们会逐渐深入到AngularJS的内部原理中。现在，让我们先来写一个Hello World应用。<！DOCTYPE html>
Hello {{ name }}
虽然这个例子不怎么有趣，但它展示了AngularJS最基本也最令人印象深刻的功能之一：数据绑定。2.1AngularJS中的数据绑定
在Rails等传统Web框架中，控制器将多个模型中的数据和模板组合在一起形成视图，并将其提供给用户，这个组合过程会产生一个单向视图。如果没有创建任何自定义的JavaScript组件，视图只会体现它渲染时模型暴露出的数据。在写这篇文章时，已经出现了好几个可以在视图和模型之间自动进行数据绑定的框架。
AngularJS则采用了完全不同的解决方案。它创建实时模板来代替视图，而不是将数据合并进模板之后更新DOM。任何一个独立视图组件中的值都是动态替换的。这个功能可以说是AngularJS中最重要的功能之一，也是让我们只用10行代码，并且在没有任何JavaScirpt的情况下就可以写出Hello World的关键。
要实现这个功能，只要在HTML页面中引用angular.js，并在某个DOM元素上明确设置ng-app属性即可。ng-app属性声明所有被其包含的内容都属于这个AngularJS应用，这也是我们可以在Web应用中嵌套AngularJS应用的原因。只有被具有ng-app属性的DOM元素包含的元素才会受AngularJS影响。视图中的插值会在计算一个或多个变量时被动态替换，替换结果是字符串中的插值被变量的值替代。例如，如果有一个叫做name的变量，它的值是“Ari”，那么视图中的"Hello {{ name }}"字符串会被替换成“Hello Ari”。
自动数据绑定使我们可以将视图理解为模型状态的映射。当客户端的数据模型发生变化时，视图就能反映出这些变化，并且不需要写任何自定义的代码，它就可以工作。
在MVC（Model View Controller，模型-视图-控制器）的世界里，控制器可以不必担心会牵扯到渲染视图的工作。这样我们就不必再担心如何分离视图和控制器逻辑，并且也可以使测试变得既简单又令人愉悦。MVC是一种软件架构设计模式，它将表现从用户交互中分离出来。通常来讲，模型中包含应用的数据和与数据进行交互的方法，视图将数据呈献给用户，而控制器则是二者之间的桥梁。这种表现分离能将应用中的对象很好地隔离开来，因此视图不需要知道如何保存对象，只要知道如何显示它即可。这也意味着数据模型不需要同视图进行交互，只需要包含数据和操作视图的方法。控制器用来存放将二者绑定在一起的业务逻辑。
AngularJS会记录数据模型所包含的数据在任何特定时间点的值（在Hello World例子中就是name的值），而不是原始值。
当AngularJS认为某个值可能发生变化时，它会运行自己的事件循环来检查这个值是否变“脏”。如果该值从上次事件循环运行之后发生了变化，则该值被认为是“脏”值。这也是Angular可以跟踪和响应应用变化的方式。
这个事件循环会调用$digest()循环，第23章将会详细介绍。
这个过程被称作脏检查（dirty checking）。脏检查是检查数据模型变化的有效手段。当有潜在的变化存在时，AngularJS会在事件循环时执行脏检查（第24章会深入讨论）来保证数据的一致性。
如果使用KnockoutJS这种通过在数据模型上绑定事件监听器来监听数据变化的框架，这个过程会变得更复杂且低效。处理变化管理、依赖跟踪和大量的事件触发（event firing）是非常复杂的，而且会在应用程序UI性能方面导致额外的问题。尽管存在更高效的方式，但脏检查可以运行在所有浏览器中并且是可预测的。此外，很多在速度和效率方面有要求的软件都会使用脏检查的方案。
借助AngularJS，不需要构建复杂和新的JavaScript功能，就可以在视图中实现类自动同步的机制。
为了表示内部和内置的库函数，Angular使用$预定义对象。尽管这类似于全局的jQuery对象$，但它们是完全无关的。只要遇到$符号，你都可以只把它看作一个Angular对象。2.2简单的数据绑定
审阅一下上面写的代码，我们使用ng-model指令将内部数据模型对象（$scope）中的name属性（property）绑定到了文本输入字段上。
这意味着无论在文本输入字段中输入了什么，都会同步到数据模型中。数据模型对象（model object）是指$scope对象。$scope对象是一个简单的JavaScript对象，其中的属性可以被视图访问，也可以同控制器进行交互。如果不理解这个概念也没有关系，后面的例子将会对这个概念进行详细说明。
双向数据绑定（bi-directional）意味着如果视图改变了某个值，数据模型会通过脏检查观察到这个变化，而如果数据模型改变了某个值，视图也会依据变化重新渲染。
在输入字段上使用ng-model指令来实现数据绑定，如下所示：
Hello{{ person.name }}
这样绑定就设置好了（没错，就是这么简单）。我们可以观察一下视图是如何更新数据模型的。当输入字段中的值发生变化时，person.name会被更新，而视图将反映出这个更新。
我们仅通过视图就实现了一个双向数据绑定。为了从其他角度（后端到前端）解释双向数据绑定，后面会深入介绍控制器。2.3命名你的应用
你可以通过给ng-app属性分配一个值来命名你的应用。注意，下面的代码中将html标签中的ng-app属性改变成了ng-app="myApp"。从技术上讲，当我们谈到ng-app="myApp"时，我们的意思是告诉Angular在这里我们想要使用哪个模块。更多信息可以参考第3章。<！DOCTYPE html>
Hello {{ name }}
正如ng-app声明所有被它包含的元素都属于AngularJS应用一样，DOM元素上的ng-controller属性声明所有被它包含的元素都属于某个控制器。
为了解释这个概念，我们将前面的例子修改成如下的样子：
Hello {{ person.name }}
那么我们的代码看起来应该像这样：<！DOCTYPE html>
Hello {{ name }}
现在，如果你重新载入你的应用，并且打开浏览器开发者工具中的控制台，那么你应该会看到如下所示来自Angular的错误信息：Uncaught Error: [$injector:modulerr] Failed to instantiate module myApp due to……
这并不是你的错。Angular只是告诉我们还没有创建myApp模块。现在我们来创建：angular.module('myApp', []).controller('MyController', function($scope) { // 稍后填充这里的代码});你可以将这些代码放在通过html文档加载的JavaScript文件中或者内联的
Hello {{ name }}
修改一下示例，让我们的时钟每秒钟滴答一下。
改变MyController为以下代码：angular.module('myApp', []).controller('MyController', function($scope, $timeout) { var updateClock = function() { $scope.clock = new Date(); $timeout(function() { updateClock(); }, 1000); }; updateClock();});在这个示例中，MyController函数定义接受两个参数，DOM元素的$scope对象和$timeout。从技术上讲这叫作依赖注入。不要担心这个奇怪的术语：它只是一种我们想要使用的require（或者import）其他库的方式。后面我们会学习如何控制它，第13章会使用很多强大的库。
在控制器代码中，定时器的触发会调用updateClock函数，它会将新的$scope.clock变量设置为当前时间。
$timeout接受两个参数：
●第一个是一个间歇调用的函数；
●第二个是毫秒数，表示间歇调用之间的等待周期。
最终效果是这个$timeout将会每1000毫秒调用一次调用updateClock的函数。
在updateClock内，我们给变量$scope.clock赋值为new Date()。这个$scope是你的代码和视图之间的Angular“胶水”。在后面的章节中我们会深入讨论$scope。现在，只需知道当为特殊变量$scope分配一些信息时，你可以在你的HTML视图中访问这些信息。
为了在HTML视图中展示这个$scope.clock，我们使用如下所示的模板标记：
{{clock}}
注意这里：在我们的JavaScript代码的MyController中我们给$scope.clock分配了一个值。但是在我们的视图中只指定了clock来读取该值（而不是$scope.clock）。这是因为这个scope隐含在视图中。稍后我们会讨论更多关于它如何工作的信息。
让我们先从上一个示例中移除input和h1标签，此时我们的Web app示例看起来应该像这样：<！doctype html>
Hello {{ clock }}！
那么上面的代码就变成了：<！doctype html>
Hello {{ clock }}！
我们将会把上面的JavaScript代码放到js/app.js文件中，而不是直接嵌入到HTML中：// app.jsangular.module('myApp', []).controller('MyController', function($scope, $timeout) { var updateClock = function() { $scope.clock = new Date(); $timeout(function() { updateClock(); }, 1000); }; updateClock();});2.5数据绑定的最佳实践
由于JavaScript自身的特点，以及它在传递值和引用时的不同处理方式，通常认为，在视图中通过对象的属性而非对象本身来进行引用绑定，是Angular中的最佳实践。
如果把这个最佳实践应用到上面时钟的例子中，需要把视图中的代码改写成下面这样：<！doctype html>Hello {{ clock.now }}！
在这个例子中，相比每秒钟都更新$scope.clock，更新clock.now的值会是更好的选择。有了这个优化后，我们将对反映数据变化的逻辑进行如下修改：// 在app.js中angular.module('myApp', []).controller('MyController', function($scope, $timeout) { $scope.clock = {}; var updateClock = function() { $scope.clock.now = new Date(); $timeout(function() { updateClock(); }, 1000); }; updateClock();});将所有绑定都通过这样的形式放在视图中是个非常好的主意。第3章模块
在JavaScript中，将函数代码全部都定义在全局命名空间中绝对不是什么好主意，这样做会导致冲突从而使调试变得非常困难，浪费宝贵的开发时间。
本章将讨论如何写出高效、能用在生产环境中的控制器代码，并把它封装在一个我们称之为模块（module）的单元内。
在AngularJS中，模块是定义应用的最主要方式。模块包含了主要的应用代码。一个应用可以包含多个模块，每一个模块都包含了定义具体功能的代码。
使用模块能给我们带来许多好处，比如：
●保持全局命名空间的清洁；
●编写测试代码更容易，并能保持其清洁，以便更容易找到互相隔离的功能；
●易于在不同应用间复用代码；
●使应用能够以任意顺序加载代码的各个部分。
AngularJS允许我们使用angular.module()方法来声明模块，这个方法能够接受两个参数，第一个是模块的名称，第二个是依赖列表，也就是可以被注入到模块中的对象列表。angular.module('myApp', []);这个方法相当于AngularJS模块的setter方法，是用来定义模块的。
调用这个方法时如果只传递一个参数，就可以用它来引用模块。例如，可以通过以下代码来引用myApp模块：// 这个方法用于获取应用angular.module('myApp')这个方法相当于AngularJS模块的getter方法，用来获取对模块的引用。
接下来，就可以在angular.module('myApp')返回的对象上创建我们的应用了。
开发大型应用时，我们会创建多个模块来承载业务逻辑。将复杂的功能分割成不同的模块，有助于单独为它们编写测试，相关信息参见第21章。3.1参数
下面是angular.module()的参数列表。3.1.1 name（字符串）
name是模块的名称，字符串变量。3.1.2 requires（字符串数组）
requires包含了一个字符串变量组成的列表，每个元素都是一个模块名称，本模块依赖于这些模块，依赖需要在本模块加载之前由注入器进行预加载。第4章作用域
作用域（scope）是构成AngularJS应用的核心基础，在整个框架中都被广泛使用，因此了解它如何工作是非常重要的。
应用的作用域是和应用的数据模型相关联的，同时作用域也是表达式执行的上下文。$scope对象是定义应用业务逻辑、控制器方法和视图属性的地方。
作用域是视图和控制器之间的胶水。在应用将视图渲染并呈献给用户之前，视图中的模板会和作用域进行连接，然后应用会对DOM进行设置以便将属性变化通知给AngularJS。这个功能让XHR请求等promise对象的实现变得非常容易。查看第17章获取更多关于promise对象的内容。
作用域是应用状态的基础。基于动态绑定，我们可以依赖视图在修改数据时立刻更新$scope，也可以依赖$scope在其发生变化时立刻重新渲染视图。
AngularJS将$scope设计成和DOM类似的结构，因此$scope可以进行嵌套，也就是说我们可以引用父级$scope中的属性。
试读结束[说明：试读内容隐藏了图片]