0

使用 Angular + Angular 材质 12

如果你想关闭 MatSidenav，那么我发现的几乎每个解决方案都说： (click)="sidenav.close()"在 html 组件中。

但我的注销功能需要那个（点击）(click)="onLogoutSideNav()"

onLogoutSideNav() {
    this.authService.logout();
  }

我需要从组件中的方法内部而不是从 html 关闭 MatSidenav。我能找到的唯一解决方案是：

sidenav!: MatSidenav
...
onLogoutSideNav() {
    this.authService.logout();
    this.sidenav.close();
  }

但是这样做会返回未定义的 this.sidenav。

有很多使用@ViewChild 的解决方案，但我没有将导航拆分为标题和侧边栏组件。我保持简单，在 app.component 中这样做。

<mat-list-item *ngIf="isAuth" routerLink="/"><button mat-icon-button><mat-icon>logout</mat-icon><span class="sidenav-span" (click)="onLogoutSideNav()">Logout</span></button></mat-list-item>

我在这里想念什么？

4

1 回答 1

1

您可以在点击事件上调用多个函数。例如 =>

(click)="onLogoutSideNav();test()"

希望这能回答你的问题。

于 2021-11-19T18:15:27.910 回答