时间戳

首页 > 解决方案 > 防止用户在没有 VIewChild 的情况下使用 mat-tab-group 导航到其他选项卡

angular - 防止用户在没有 VIewChild 的情况下使用 mat-tab-group 导航到其他选项卡

问题描述

我有这个 mat-tab-group ：

mat-tab-group
    class="brand-tabs"
    [disableRipple]="true"
    *ngSwitchCase="types.project"
    (selectedTabChange)="changeProjectTab($event)"
    [selectedIndex]="selectedProjectIndex"
>
.........

ts 中的函数：

changeProjectTab(event) {
    if (event.index > 0) {
        this.selectedProjectIndex = 0;
        this.modalService.contentModal(
            this.upgradeRef,
            this.translateService.instant('message')
        );
    }
}

在这个 mat-tab-group 中，我有 3 个选项卡，我想停止导航到索引 = 1,2 的选项卡，始终保持在索引 = 0 的选项卡上。我试过这样，但没有工作。你能给我一些想法吗？谢谢

标签： angulartypescriptangular-materialangular7angular8

解决方案

只是禁用不应被允许导航的组件/选项卡？

https://material.angular.io/components/tabs/examples - “标签导航栏的基本使用” - “禁用链接”

推荐阅读