1.理解组件
组件是一种特殊的指令，使用更简单的配置项来构建基于组件的应用程序架构
这样他能简单地写app，通过类似的web Component 或者angular2的样式。
web Component 是一个规范。马上就要成为标准。
应用组件的优点：
- 比普通指令配置还简单
- 提供更好的默认设置和最好的实践
- 对基于组建的应用架构更优化。
- 对angular2的升级更平滑。
不用组建的情况:
- 对那些在 compile或者pre-link阶段要执行操作的指令，组件不能用，因为无法到达那个阶段。
- 如果你想定义指令的 priority，terminal，multi-element，也不能用。
- 组件只能通过元素标签触发，其他的只能用命令。
2.创建和配置组件
组件可以用.component 注册（在 angular.module 创建的module）。
这个方法有两个参数
- 组件名称
- 组件配置对象（和指令的区别，一个是工厂方法，一个是对象）
3.基于组件的应用程序架构
经常说，用组件构建基于组件的应用程序简单方便。
组件只控制视图和数据：组件永远不应该修改作用域之外的DOM或数据。在angular中可以任意修改任何地方的数据，因为scope是原型继承和观察的。这个是实践出来的，但是，导致的问题是你根本不清楚程序中哪一部分负责修改数据。
-
组件有一个定义很好的公共api--输入和输出。
然而隔离的作用域能力有限，因为angular使用双向绑定。所以如果你传递一个对象到组件，用这种方式bindings:{item:'='}，修改一个属性，这个改变就会反射到父级组件里面。对组件来说，只有组建自己的数据自己才能修改，这样数据一旦修改，就可以很容易找到是谁修改的。基于这个原因，组件应该遵循一些简单的规范：
.输入应该使用 < 和 @ bindings. <表示单向绑定，和 = 的区别是单向绑定的不被watch。这样，你在内部修改的属性不会更新父级scope。普遍的规则是永远不要改变scope中的对象或者数组属性。@bindings 用在输入时字符串，尤其是这个值不会改变的情况。bindings:{ hero: '<', comment: '@' }.输入 & 符号绑定。来应用外部回调函数
bindings:{ onDelete: '&', onUpdate: '&' }.代替操作输入数据，组件调用正确的输出事件和改变的数据，对删除来说，组件不会删除 hero自己，而是会通过事件发回自己的组件。
<!-- note that we use kebab-case for bindings in the template as usual --> <editable-field on-update="$ctrl.update('location', value)"></editable-field><br> <button ng-click="$ctrl.onDelete({hero: $ctrl.hero})">Delete</button> -
组件有一个很好的声明之后。每个组件都实现了生命周期钩子。这些钩子就是这个组件在某个生命周期调用的方法。组件实现了下面的一些钩子方法:
. $onInit() --
一个应用程序是一个组件的树
理想情况下，整个程序都应是一个组件树。这个树定义了很清晰的输入和输出。并且缩减双向绑定到最少，这样组件的数据和状态更清晰，能很好预测、判断。
