首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >路由器中的链路链路不变

路由器中的链路链路不变
EN

Stack Overflow用户
提问于 2020-01-02 17:26:59
回答 1查看 170关注 0票数 0

我正在创建一个带有链接的侧边栏。我有3个组件,侧边栏组件链接2个工具栏组件,这样我就可以有菜单按钮,每次我会隐藏侧边栏。

这是在我的侧边栏组件上。

代码语言:javascript
运行
复制
<mat-sidenav-container class="sidenav-container">
    <mat-sidenav #drawer class="sidenav" fixedInViewport
        [attr.role]="(isHandset$ | async) ? 'dialog' : 'navigation'"
        [mode]="(isHandset$ | async) ? 'side' : 'side'"
        [opened]="(isHandset$ | async) === false">
      <mat-toolbar>Cust_Corp</mat-toolbar>
      <div class="dashboard">
        <div class="container">
          <p><a routerLink="/cust-toolnav">Home</a></p>
          <p><a routerLink="/cust-regform">Create a customer</a></p>
          <p><a href="#">Display a customer</a></p> 
        </div>
        <router-outlet></router-outlet>
      </div>
    </mat-sidenav>

    <mat-sidenav-content>
        <app-cust-toolnav [title]="title" [burgerMenu]="isHandset$ | async" (burgerClick)="drawer.toggle()"></app-cust-toolnav>
    </mat-sidenav-content>
    <mat-sidenav-content>
        <app-cust-regform [title]="title" [burgerMenu]="isHandset$ | async" (burgerClick)="drawer.toggle()"></app-cust-regform>
    </mat-sidenav-content>  

</mat-sidenav-container>

我有一个为我的第二个工具栏。每次我单击这些链接时,url都会改变,但工具栏主体不会改变。

代码语言:javascript
运行
复制
          <p><a routerLink="/cust-toolnav">Home</a></p>
          <p><a routerLink="/cust-regform">Create a customer</a></p>

我有检查应用程序路由模块,包括

代码语言:javascript
运行
复制
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { CustToolnavComponent } from './cust-toolnav/cust-toolnav.component';
import { CustRegformComponent } from './cust-regform/cust-regform.component';


const routes: Routes = [
  { path: '', redirectTo: 'cust-toolnav', pathMatch: 'full' }, <-- I tried removing / and adding /.
  { path: 'cust-toolnav', component: CustToolnavComponent },
  { path: 'cust-regform', component: CustRegformComponent }
];

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

回答 1

Stack Overflow用户

发布于 2020-01-02 21:11:40

这是因为你错误地实现了sidenav。它应该只有1个<mat-sidenav-content>,并将路由器插座放在<mat-sidenav-content>

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/59560956

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档