时间戳

首页 > 解决方案 > 使用角度材料的多级菜单栏

angular - 使用角度材料的多级菜单栏

问题描述

我在使用角度材料创建多级菜单栏时尝试了以下代码。但似乎路由没有按预期工作。有没有人知道这里出了什么问题或导致此问题的任何原因？

导航组件.html

check `routerlink` path whatever u mention it doesn't work go with a method

<a mat-list-item routerLinkActive="active" class="navAd-link" [routerLink]="['/students']" (click)="navAd.toggle()">
    <mat-icon mat-list-icon>group</mat-icon>
    <span class="title" mat-line>Students</span>
</a>

路线.ts

import { StudentsComponent } from './Students/Students.component';
import {Routes} from '@angular/router';

export const appRoutes: Routes = [
    {path: 'students', component: StudentsComponent},
    {path: '**', redirectTo: 'students', pathMatch: 'full'},
];

标签： angularangular-material

解决方案

不知道你是否还在寻找答案。如果是，并且对于新观众，那么我为 Angular 创建了一个插件，它创建了一个多级菜单。现在您也可以将此多级菜单转换为 Accordion，例如 Check this example。

这是一个NPM 链接和Github 链接，文档非常简洁。

以防万一，如果您想查看更多示例，我为您准备了一个演示，这是演示的Github Repo。

如果有些东西对你不起作用，而你仍然想使用这个插件，那么在这里创建一个问题，我会帮助你。

PS它也适用于IE11。

谢谢

推荐阅读