在开始做第一个AngularJS app之前，你需要知道AngularJS其中的一些不同组件。以下是必须了解的：
1. Model：展示给用户的数据。是简单的POJO。
2. View：这是用户访问你的页面时看到的，也就是原始的HTML牵涉到一些 directives和expressions被编译后并且链接了正确的scope后的结果。
3. Controller：驱动你的应用的业务逻辑。
4. Scope：就是一个context，其中存有 data models和functions。一个controller常常在scope中设置这些models和functions。
5. Directives：它会教html新的语法。它扩展了Html，利用定制的元素和属性。
6. Expressions：在HTML中的{{}}就是表达式。它可以用来访问scope models以及functions。
7. Template：就是HTML加上一些额外的标签，形式如指令和表达式。
好了，说的够多了，接下来开始开发这个程序。
目标：创建一个HTML，询问用户的年薪以及它们愿意花费其中的百分之多少用来购物。所以要有2个输入框，一个用于工资，一个用于百分比。还需要一个<span>标签，用于显示计算结果。只要任何输入框的值变了，结果就会立即更新。
如何实现：如果纯粹用js或jQuery，你会怎么做呢？html搞好后，给输入框注册keyup事件的回调函数。在回调函数中，读取输入框的值，计算结果，设置<span>标签的innerHTML属性为计算的结果。
但是用AngularJS的话，根本一行JS都不需要写。在下载的angular-seed-master里的app目录中，新建一个文件叫 test.html。内容如下：
<!DOCTYPE html>
<html lang="en" ng-app>
<head>
<title>My First AngularJS App</title>
</head>
<body ng-init="salary=0;percentage=0">
Your Salary?
<input type="text" ng-model="salary">
<br/>How much should you invest in gadgets?
<input type="text" ng-model="percentage">%
<br/>The amount to be spent in shopping will be:
<span>{{salary*percentage*0.01}}</span>
<script src="lib/angular/angular.js"></script>
</body>
</html>
现在要访问这个页面，我们需要一个web服务器，要运行Angular Seed自带的web服务器，你还需要安装了Node.js。要测试是否成功安装了Node.js，在命令行中输入node，回车，就能知道了。
运行web服务器：在命令行中，转到angular-seed-master目录中，执行命令：node scripts/web-server.js，
会在8000端口上启动服务器。
访问我们新建的html：http://localhost:8000/app/test.html
就这么简单，所以AngularJS很适合快速web应用开发。
1. An AngularJS application bootstraps with the ng-app attribute (actually, it's a directive).
2. ng-init 初始化你的数据模型。
3. ng-model 将一个输入框和模型数据绑定在一起，这建立起了一个双向绑定。
4. The main purpose of an expression is binding the model data to the view uni-directionally; 也就是从模型同步到视图。
The beautiful thing is that the expression is re-evaluated each time any of the data models it depends on changes.