Angular学习(三)【指令生命周期，路由跳转】

指令的生命周期

指令与组件的基本结构非常相似，差别在于组件中包含了模板。组件的部分生命周期方法与指令的相同，下面来看一下：

ngOnInit

ngOnInit 钩子在 Angular 完成初始化输入属性的数据绑定后，初始化指令。

ngOnChange

ngOnChange 在 Angular 初始化输入属性的数据绑定前响应一次，之后当检测到数据绑定发生变化就会被调用，这个方法接受一个包含当前和之前数据的 SimpleChange 对象。

ngDoCheck

ngDoCheck 方法用于检测变化，该钩子方法会在每次变化检测发生时被调用。

ngOnDestroy

ngOnDestroy 方法在 Angular 销毁指令之前执行清理工作，此时应注销观察者对象挥着解绑事件处理器以避免内存泄漏。

尽管组件和指令有相似的结构和一些相同的生命周期方法，但是它们也有一些不同点。

不同与属性指令和结构指令，组件不是以 HTML 的元素属性的形式使用，而是以自定义标签的形式使用，原因在于组件带有模板。组件可作为对 HTML 元素的扩展，将自身的模板视图插入至 DOM 中，而属性指令和结构指令是对 HTML 元素属性的扩展，作用是扩展已有的 DOM 元素的行为和样式，或者改变这些元素在 DOM 中的结构。

---

路由跳转

使用指令跳转

<a [routerLink]="['/path']">

使用代码跳转

router.navigateBuUrl(['/path']);
// or
router.navigate(['/path']);