javascript - Angular - 即使不存在 href 标签，routerLink 仍会重新加载

Question

我有这个代码:

<a [routerLink]="['/user/', user.id]">
    {{ user.username }}
</a>

这是routing.ts

// imports removed for clarity

const routes: Routes = [  
  { path: '', component: MainLayoutComponent, children: [
      { path: '', component: SidebarLayoutComponent, children: [
          { path: 'feed', component: HomefeedComponent },
          { path: 'discover', component:DiscoverComponent },
        ]
      },
      { path: 'user/:id', component: UserComponent },

    ]}
];

@NgModule({
  imports: [ RouterModule.forRoot(routes) ],
  exports: [ RouterModule ]
})
export class AppModuleRouting {}

我有两页。第1页和第2页。在这两个页面中，都渲染了一个组件:user-box-component.html，其中有上述代码。

但在第 1 页中，如果我单击“用户名”，它仍然会重新加载页面。在第 2 页中，它按照预期仅重新加载 DOM。

知道为什么在第 1 页中仍然发生硬重新加载吗？

编辑:

更多信息:如果我进入用户页面，并且 routerLink 运行良好。但如果我转到/discover 页面，它会重新加载页面。难道是因为没有routerState root而导致reload？

Answer 1

检查此 stackblitz 链接。我创建了示例应用程序。

https://stackblitz.com/edit/routerlink-xqqztn

虽然这可能不完全符合您的情况，但我尝试按照您的描述进行操作

如果这不能解决问题，请创建 stackblitz 链接