如何解决Angular 子容器辅助路由器出口 routerLink 问题
我的容器页面中有一个子导航,用于激活我的组件并将其加载到我命名的路由器出口中。我的问题是我页面上的另一个使用“routerLink”的按钮。在我与子导航项交互或单击子导航项并将我的组件加载到我命名的路由器出口后,我的按钮的 routerLink 值被修改为“/project/1/(add-review//aside:aside-one)”,这会中断我的导航并被重新路由回我的主页。请参阅下面的代码。
<div class="project">
<header class="project__header">
<h1 class="project__title">Project Page</h1>
</header>
<div class="project__content">
<div class="project__left-column">
<a class="project__btn-add-review"
[routerLink]="['/project',projectId,'add-review']"
target="_blank">
Add Review
</a>
</div>
<div class="project__right-column">
<app-rounded-button-container>
<app-rounded-button displayText="Aside One"
[isActive]="true"
[routerLink]="[{ outlets: { aside: ['aside-one'] } }]"
[skipLocationChange]="true">
</app-rounded-button>
<app-rounded-button displayText="Aside Two"
[isActive]="false"
[routerLink]="[{ outlets: { aside: ['aside-two'] } }]"
[skipLocationChange]="true">
</app-rounded-button>
</app-rounded-button-container>
<router-outlet name="aside"></router-outlet>
</div>
</div>
export const PROJECT_ROUTES: Routes = [
{
path: ':projectId',component: ProjectComponent,data: {
breadcrumb: [
{
label: 'Project',path: ['/project'],},],children: [
{
path: 'aside-one',pathMatch: 'full',outlet: 'aside',component: AsideRightOneComponent,{
path: 'aside-two',component: AsideRightTwoComponent,{
path: ':projectId/add-review',component: AddReviewComponent,data: { hideNavMenu: true },];
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。