[英]Angular unwanted reload page
当我单击 routerLink 时,它会转到链接页面并重新加载整页(又名父组件刷新)
我尝试制作第二个 app-routing.module,如下例所示: https://angular.io/guide/router-tutorial-toh但它并没有解决问题。 既不使用路由器插座名称。 我没有想法了
我的路线是这样的:
const routes: Routes = [
{
path: 'account',
component: StandardLayoutComponent,
canActivate: [AuthGuard],
children: [
{ path: 'schools', component: SchoolsComponent },
{
path: 'contacts',
component: ContactsComponent,
},
{
path: 'dashboard',
component: DashboardComponent,
},
],
},
{
path: ':schoolSlug',
component: RegistrationLayoutComponent,
children: [
{
path: 'login',
component: LoginComponent,
},
{
path: 'forgot_password',
component: ForgotPasswordComponent,
}
],
},
{ path: '**', redirectTo: 'account/dashboard', pathMatch: 'full' },
];
侧导航组件 html:
<div
class="d-flex flex-row mb-3 pointer lightHover"
[routerLink]="['dashboard']"
>
<div class="align-self-center col-md-3 pr-0 text-center">
<img src="/assets/img/icons/squares.svg" />
</div>
<div class="col-md-9">
<h6 class="font-weight-bold text-gray-dark mb-1 pt-3">
{{ "MENU.ANALYSE.TITLE" | translate }}
</h6>
<p class="sidenav-txt pb-3">
{{ "MENU.ANALYSE.DESCRIPTION" | translate }}
</p>
</div>
</div>
<div
class="d-flex flex-row mb-3 pointer lightHover"
[routerLink]="['contacts']"
>
<div class="align-self-center col-md-3 display-5 pr-0 text-center">
<img src="/assets/img/icons/user.svg" />
</div>
<div class="col-md-9">
<h6 class="font-weight-bold text-gray-dark mb-1 pt-3">
{{ "MENU.CONTACTS.TITLE" | translate }}
</h6>
<p class="sidenav-txt pb-3">
{{ "MENU.CONTACTS.DESCRIPTION" | translate }}
</p>
</div>
</div>
我在 app.component 中有一个路由器插座,在 standardLayoutComponent 中有一个(我在其中也调用 header 和 sidenav)例如,当我单击从“/account/dashboard”到“/account/contacts”的路由器链接时,standardLayoutComponent 刷新(使用 header 和 sidenav) 而不是仅刷新 DashboardComponents
感谢您的帮助(使用最新版本的角度)
好的,我终于解决了这个问题。 我通过倾倒我的组件来查看问题是否来自它们。
就是这行代码:
constructor (
...
){
this.router.routeReuseStrategy.shouldReuseRoute = function () {
return false;
};
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.