子路径 Angular 8

Question

我已经创建了一些组件和路径。我也有一些子组件现在我所做的是最初我将加载我的组件 logincomponent。当您登录时，将呈现两个组件，一个是父组件仪表板，另一个是仪表板内的子组件 alllleadcomponent。这是工作找到。现在我已经创建了一些 links，当我点击主页时它会将我重定向到 logincomponent 所以 我想要的是当我点击主页时 link 我想呈现所有 leadcomponent 而不是重定向到 logincomponent 所以这是我的 links

 <ul class="menulist">
            <li><a routerLink=""><mat-icon >home</mat-icon>Home</a></li>
            <li><a routerLink="addlead"><mat-icon>add_circle</mat-icon>Add Lead</a></li>
            <li><a routerLink="adduser"><mat-icon>person_add</mat-icon>Add User</a></li>
  </ul>

这里是app.module.ts

const appRoutes: Routes =[

  { 
    path:'dashboard',
    component:DashboardComponent,
    children:[
      {path:'',component:AllleadsComponent},
      {path:'adduser',component:AdduserComponent},
      {path:'addlead',component:AddleadComponent},
      {path:'editLead',component:UpdateLeadComponent}
    ]
  },
  {path:'',component:LoginComponent}
]

Answer 1

使用您的路由器配置设置，您可以导航到 AllleadsComponent 的唯一方法是导航到 http://localhost:4200/dashboard。

你被定向到 LoginComponent 因为你的 appRoutes 数组中的最后一个对象：

{path:'',component:LoginComponent}

这告诉 Angular 路由器，当您导航到 http://localhost:4200 时，您希望加载 LoginComponent。

要获得您想要的内容，请将主页按钮的 html 更改为：

<li><a routerLink="/dashboard"><mat-icon >home</mat-icon>Home</a></li>

子路径 Angular 8

Child Path Angular8

angular

components

angular-routerlink