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

标签 javascript angular routes angular-router

我有这个代码:

<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?

最佳答案

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

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

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

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

关于javascript - Angular - 即使不存在 href 标签,routerLink 仍会重新加载,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57816671/

相关文章:

javascript - 数组替换后的 VueJS 动画

javascript - 带有表单数据的 Blueimp 多 block 上传

laravel - 在用户登录页面后添加路由

ruby-on-rails - 获取rails路线的参数

php - 删除 symfony 路由组件中的默认语言环境前缀

javascript - 使用 jQuery 选择附加的链接按钮

javascript - 如何测试传递给函数的变量?

javascript - iOS跨域API

angular - Jasmine:Angular Typescript 项目中的 "Incomplete: No specs found"

angular - 'CssSyntaxError' - 编译失败