前言：
已经不记得具体开始接触Angular的时间了，也很久没来参加社区的活动了，进入了创业公司，开始了新的忙碌而又充满挑战的职业生涯。不过还是希望自己坚持随便写写的习惯，保持下去，继续活跃在社区。
忠心希望试读活动越办越好~
正文：
以前很多人抱怨angular的资料比较少，虽然出自名门（来自Google），其实相对而言，在早期的时候：是的。
去infoQ上看，angular的tag确实也不是很多。前一段Dave Gruber对热门的js框架发展就行了深入分析，其中就包括Angular，以及Backbone这样的。
从项目贡献者的总数，代码行数，总提交量等等维度，Angular已经展现出大社区的样子了。写本文的时候，特地去看了一下github上：
- 官网：http://angularjs.org/
- star 已经到了17681了
- fork 目前是4970
- contributors 539
- commits 3832
- 目前最新版本1.2.4
了解Dart的同学，应该也看到谷歌开始把AngularJS移植到Dart，命名：Augular.dart.
（它不是一个调用JavaScript的包装器，用Dart编写的），AngularJS Is Being Ported to Dart
讲这么多其实想说，fe们，如果你还没有开始接触angular，或者对它不是很熟悉的话，加入到angular的队伍中来。
这个【不新不旧】的东西：
注释：
以下内容除了来自试读的Pdf，本人加了一些官方相关性的外链，还有各个api的地址，有兴趣的可以点击看看，api地址来自：http://docs.angularjs.org/api/
指令：
angular的一个特点：模板可以写成HTML，加入了一些新的属性。
- 告诉angular页面中需要他管理的
<html ng-app>
- 指定每一个控制器负责监视视图的哪个部分
<body ng-controller="bodyController">
<script>
function bodyController(){
}
</script>
ng-repeat
- 根据集合中的项目一次创建一组元素的多份拷贝，比如你遍历创建一组列表。
<ul ng-controller="jobController">
<li ng-repeat="job in jobs">
<a href="http://www.wandoujia.com/join#getJobInfo={{job.id}}">{{job.name}}</a>
</li>
</ul>
<script>
//@tip 如果你很细致地看到这里，诚挚地欢迎加入我们
// http://www.wandoujia.com/join#getJobInfo=5
var jobs = [
{name:"产品设计师",id:1},
{name:"资深视觉设计师",id:3},
{name:"用户界面工程师",id:5},
{name:"Windows 研发工程师",id:6},
{name:"Android 研发工程师",id:7}
];
function jobController($scope){
$scope.jobs = jobs;
}
</script>
补充一些：
- $index 返回当前的元素序号
- $first 是否是第一个元素
- $middle 是否是中间的某个元素
- $last 是否是最后一个元素
ng-model
- 把输入数据绑定到模型中的一部分属性上
事件处理指令：
- ng-click
- ng-dblclick
- ng-submit 自动阻止浏览器默认行为
- ng-change 对于输入元素来说，使用它来指定一个控制器方法，一段修改输入值，会被调用
ng-show和ng-hide
- 根据传递的表达式来显示和隐藏元素
原理： 把元素的样式设置为display:block显示；display:none来隐藏
- 对于img和a标签，可以使用这两个指令
<img ng-src="***/{{hash}}" />
<a ng-href="***/{{hash}}"></a>
ng-bind
- 显示并刷新文本
//方式1：花括号
<p>{{param}}</p>
//方式2：基于属性
<p ng-bind="param"></p>
- 可以直接设置元素的css style
测试的地方： http://jsfiddle.net/api/post/library/pure/
<input value="set" type="button" ng-click="myStyle={color:'red'}">
<span ng-style="myStyle">test</span>
<pre>myStyle={{myStyle}}</pre>
- 如果表达式成立，readyonly的属性会设置到元素里面
测试地址： http://jsfiddle.net/api/post/library/pure/
<input type="checkbox" ng-model="checked" />
<input type="text" ng-readonly="checked" value="test"/>
再说说那个
$scope
其实上面的一些例子里面已经出现了。
在Controller的函数形参里面，我们也把数据定义到$scope下面的一个键里面。
可以通过$scope对象把数据模型和函数暴露给视图。
$scope当成一个上下文环境，它让数据模型的变化可以观察。
下面的实例中控制器嵌套了：
<div ng-controller="ParentController">
<div ng-controller="ChildController"></div>
</div>
说明：
其实嵌套发生在$scope对象上，父控制器对象上的$scope会被传递给内部嵌套控制器的$scope。
$scope.$watch可以监听你的数据模型变化，会返回一个函数
结语：
再次非常感谢社区和博文视点选择这些比较热门的技术图书来给大家试读，作为社区的老人，这一次必须顶起。
