…

OnPush组件内部触发的事件(包括viewChild)会引起组件的一次markForCheck Detached组件内部触发的事件不会引起组件的变化检测 OnPush组件的contentChild依然会在变化检测周期时进行自身的变化检测 OnPush进行markForCheck时,会以此对父组件进行markForCheck,一直到根组件 最顶层的OnPush或detach组件会进行NgDoCheck,但是他们的viewChild组件不会进行NgDoCheck,contentChild组件反而会…

NgZone, Angular uses it to profiling all the async actions such as setTimeout, http request and animation. For example if you dealing with heavy oprations for hundreds of times, you might want it run outside Angular Zone, so it won't trgger change de…

在系列一中,我们提到Zone.js,Zones是一种执行上下文,它允许我们设置钩子函数在我们的异步任务的开始位置和结束位置,Angular正是利用了这一特性从而实现了变更检测. Zones.js非常适合Angular 事实证明,Zones解决的问题非常适合Angular在我们的应用程序中执行变更检测所需的内容.你有没有问过自己Angular何时以及为何进行变化检测?什么时候告诉Angular: 兄弟,我的应用程序中可能发生了一个变化.你能检查一下吗?在我们深入研究这些问题之前,让我们首先考虑一下…

angular里面变化检测是非常频繁的发生的,如果你像下面这样写代码 <div> {{hello()}} </div> 则每次变化检测都会执行hello函数,如果hello函数十分耗时,则会出现占用CPU高的问题. 这时,推荐使用OnPush策略和immutable.js来提升angular应用的性能. OnPush策略可以阻止angular变化检测传入组件,这样每次变化检测不会进到你的组件里面来调用hello函数. 引入immutable.js的作用是为了更加方便的使用OnPus…

  最近做公司新项目用的angular7,中碰到了一个很头疼的问题在绑定对象中的数据改变时,页面视图没有跟新,需点击页面中的时间元素后才会更新.以前使用angularJs也经常碰到类似情况,这种时候一般的方式使使用脏检查(Dirty checking)让angularJs检查绑定到视图上的数据来实现对页面数据的刷新. 接触angular7时间还不久,angular高版本中提供了一系列组件的生命周期钩子,能在组件生命周期的各个阶段,对组件进行操作,监测组件中输入数据的变化,基本少很少碰到需要用到类…

我们通过一个NgModule来启动一个ng app,NgModule通过bootstrap配置来指定应用的入口组件. @NgModule({ bootstrap: [ AppComponent ], .... } 在 declarations 可以配置sub_component declarations: [ FriendsComponent, ChatsComponent ] 如下构造一个TestComponent: import { Component, OnInit, Input, OnC…

什么是变化检测? 变化检测的基本功能就是获取应用程序的内部状态(state),并且是将这种状态对用户界面保持可见.状态可以是javascript中的任何的数据结构,比如对象,数组,(数字,布尔,字符串等基础数据类型).这种状态最终可能成为用户界面中的段落,表单,链接或按钮,在web浏览器中我们们称之为文档对象模型(dom).将数据结构作为输入生成dom作为输出并展示给用户,我们称这个过程为渲染. 但是,在运行时发生更改时会变得更加棘手.一段时间后,DOM已经被渲染.我们如何弄清楚模型中发生了哪些…

我们将创建一个简单的MovieApp来显示有关一部电影的信息.这个应用程序将只包含两个组件:显示有关电影的信息的MovieComponent和包含执行某些操作按钮的电影引用的AppComponent. 我们的AppComponent将有三个属性:slogan,title和actor.最后两个属性将传递给模板中引用的MovieComponent元素. // app/app.component.tsimport {Component} from '@angular/core'; import {Mo…

angular 路由功能非常强大,同时angular的路由也非常脆弱,非常容易出现错误. 那么在我们遇到异常时,首先要做的是什么? 第一步:检查代码,对比官方文档,发现代码中不一致的地方进行改正. 第二步:调试代码,观察调用过程中参数传递是否正常. 第三步:百度一下. 对于我这个观点,可能会有人不服气,出现异常不应该第一时间问度娘吗?对于较熟悉angular 路由的人来说,这确实是一个快速的解决问题之道,但不是我们学习的根本.我们学习要知根知底. 对于angular的子路由,我们来看一个例子 i…