搜索到
25
篇
Angular
相关的结果
-
-
Angular 的生命周期 组件具有由 Angular 管理生命周期。Angular 创建它, 呈现它, 创建并呈现其子级, 在数据绑定属性发生更改时检查它, 并在将其从 DOM 中删除之前将其销毁。Angular 提供了生命周期钩子, 它提供了对这些关键生命时刻的可见性, 以及在它们发生时采取行动的能力。指令具有相同的生命周期钩子。ngOnChanges：当被绑定的输入属性的值发生变化时调用，首次调用一定会发生在 ngOnInit 之前。ngOninit：在第一轮 ngOnChanges 完成之后调用。ngDocheck：在每个 Angular 变更检测周期中调用。ngAfterContentInit：当把内容投影进组件之后调用。ngAfterContentChecked：每次完成被投影组件内容的变更检测之后调用。ngAfterViewInit：初始化完组件视图及其子视图之后调用。ngAfterViewChecked：每次做完组件视图和子视图的变更检测之后调用。ngOnDestory：当 Angular 每次销毁指令或组件之前调用。其中 ngOnChanges、ngOninit、ngDocheck、ngOnDestory 四个生命周期也适用于指令。这些钩子的使用都遵循相似的模式：为了得到有关这些事件的通知，需要：声明组件指令类实现接口声明钩子的 ng 方法 (如 ngOnInit)每个方法名称都是 ng 加上钩子的名称。例如，对 OnInit 我们要声明 ngOnInit 方法, AfterContentInit 要声明 ngAfterContentInit 方法，以此类推。当 Angular 知道组件实现这些函数时, 它将在适当的时候调用它们。OnInit 和 OnDestroy在初始化组件属性以及初始化任何子组件属性之前调用 OnInit 钩子。同样, 当指令实例被销毁时, 调用 OnDestroy 钩子。如果每次销毁指令时需要进行清理, 则通常使用此方法。OnChanges 和 DoCheck在我们的一个或多个组件属性被更改后调用 OnChanges 钩子。ngOnChanges 方法接收一个参数, 它指示哪些属性已更改。每当 Angular 变化检测机制注意到任何指令属性发生更改时, OnChanges 实现的默认通知系统都会触发。但是, 有时此更改通知添加的开销可能太大, 特别是如果性能是一个问题。有时, 我们只是想做一些事情, 以防一个项目被删除或添加, 或者如果只有一个特定的属性改变, 例如。如果我们遇到上述情况之一, 我们就可以使用 DoCheck 方法。注意：OnChanges 钩子会被 DoCheck 钩子重写。因此, 如果我们实现这两个钩子, OnChanges 将被忽略。变更检测为了找出有哪些改变, Angular 提供不同 differ。differ 会对组件的特定属性进行计算，以确定它是否更改。有两种类型的内置 differs: 迭代 differ、键值对 differ。声明钩子的 ng 方法 (如 ngOnInit)AfterXXXAfterContentInit 钩子在 OnInit 之后调用, 在组件的内容初始化完成之后。AfterContentChecked 的工作原理类似, 不过它是在组件检查完成后调用。这里的 检查 是指检查是变更检测系统的检查。其他两个钩子：AfterViewInit 和 AfterViewChecked 是在上面的视图完全初始化之后触发的。这两个方法仅适用于组件, 而不适用于指令。此外, AfterXXXInit 钩子在指令生命周期中只调用一次, 而 AfterXXXChecked 钩子在每次变更检测周期后调用。如果感兴趣，大家可以参考我写的实例。
-
-
-
AngularJS 监听计数 大家都知道，AngularJS 双向数据绑定很 Cool 。简单地说，Angular 在 scope 模型上设置了一个监听队列，用来监听数据变化并更新 view 。每次绑定一个东西到 View 上时 AngularJS 就会往 $watch 队列里插入一条 $watch ，用来检测它监听的 Model 里是否有变化的东西。当浏览器接收到可以被 Angular 执行环境处理的事件时，就会触发 $digest 循环，遍历所有的 $watch，Model 稳定后结束循环。大多数时候，浏览器速度很快这个过程不长，这不是一个大问题。但如果在很复杂的应用下使用不当会造成性能问题，比如说表格树组件中滥用双向数据绑定很容易造成界面很卡。
