angular - 如何禁用除angular4 Material 中选定选项卡之外的所有选项卡

标签 angular angular-material

我对 Angular 和 Material 非常陌生,并且在禁用 Angular 4 Material 中未选择的选项卡方面遇到了一个难题,我只有下面的代码。

    <md-tab-group class="flex-stretch tab-button-arrows">

      <md-tab *ngFor="let subject of subjects" label="subject.name" ></md-tab>

    </md-tab-group>

注意:subjects 是一个动态数组。

最佳答案

您需要做的就是使用 mat-tab isActive 的默认属性:ReadMore

<mat-tab-group>
  <mat-tab #tab [disabled]='!tab.isActive' *ngFor="let subject of subjects" [label]="subject.name">
    {{ subject.name }}
  </mat-tab>
</mat-tab-group>

WORKING DEMO

关于angular - 如何禁用除angular4 Material 中选定选项卡之外的所有选项卡,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48206595/

相关文章:

angular - 如何将 ngrx-effect 中的 Action 的 action.payload 传播到 catchError 或 map 运算符?

angularjs - 使用 <md-icon> 标签的汉堡图标动画

angular - 如果用户在输入中写入日期,Material DatePicker 会错误解析

javascript - 在提交表单帖子之前获取 URL

angular - 模块 'MatSpinner' 导入了意外指令 'AppModule'。请添加@NgModule 注解

angular - 工具提示问题,MatTooltip 在 Angular 中不起作用

javascript - Angular 2/4 - Material Design Snackbars 按顺序显示多条消息

angular - Ionic 2 图像未在设备上显示

node.js - 用于 e2e 前端测试的暂存后端

javascript - 在 TypeScript 中执行区分大小写的字符串排序