在 Angular 中，为什么 RouterEvent 对象对于通过用户单击导航和通过刷新加载页面是不同的

Question

this.router.events.subscribe((event) => {
        console.log('event-------', JSON.stringify(event))
})

下面是使用上面的代码在

router.events

上观察的事件对象：

如果页面通过导航加载，即通过点击事件：

{"id":2,"url":"/abc.xyz","type":0,"navigationTrigger":"imperative","restoredState":null}

如果页面通过页面刷新加载：

{"routerEvent":{"id":1,"url":"/abc.xyz","urlAfterRedirects":"/abc.xyz","type":1},"position":null,"anchor":null,"type":15}

如何确保事件对象在用户点击事件和页面刷新时保持一致。 请帮忙。

Answer 1

您可以只应用三元条件，因为预期的对象出现在根级别或

routerEvent

属性内。

this.router.events.subscribe((event) => {
    const data = event && event.routerEvent ? event.routerEvent : event;
    console.log('event-------', JSON.stringify(data))
});

至于为什么数据看起来如此不同，请提供一个 stackblitz 并复制问题来检查此问题。