当使用不同的数据加载相同的组件时,旧数据仍然显示-角度5

时间:2018-08-01 12:16:47

标签: angular5 angular-changedetection angular-renderer2

在我正在构建的Angular 5应用中,我有一个侧面菜单和主要内容菜单。

左侧的两个菜单项会为同一组件加载不同的路线数据。

默认情况下,Angular使用相同的组件实例来渲染两者。因此, ngOnInit()将仅被调用一次(一个实例)。

要渲染的组件包含一个子组件(更改检测设置为 OnPush )。子组件将数据接收为 @Input()

单击第一个菜单项时,数据将正确呈现。 单击第二个菜单项时,旧数据仍在显示,并且一旦新数据从服务器到达,就将其呈现。

上述行为是正常的。父组件中的数据还没有更改,因此子组件 @Input()未更改,因此 ngOnChange() >未触发子组件。

当数据从服务器到达时,父组件将更新其数据,因此子组件 @Input()将相应地更新,因此 ngOnChange()将在子组件上触发。因此,Angular将更新go以进行UI渲染。

这里的目标是导航到相同的组件时,甚至在等待新数据到达之前,先重置数据。

那怎么办?

谢谢

0 个答案:

没有答案