Angularmat-tab被快速选择时自动切换选项卡的问题。
创始人
2024-10-28 07:01:16
0

使用MatTabNav部分的_selectedIndex更改事件,并添加一个小延迟以解决切换太快的问题。

HTML模板:


    

组件:

import { Component, ViewChild } from '@angular/core';
import { MatTabGroup } from '@angular/material';
import { Observable, of } from 'rxjs';
import { delay } from 'rxjs/operators';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  @ViewChild('matTabs') matTabs: MatTabGroup;
  tabs = ['Tab 1', 'Tab 2', 'Tab 3'];

  onTabChange(event: any) {
    // ...your code
  }

  onSelectedIndexChange(event: any) {
    // Add a little delay to avoid tab toggling
    const observable: Observable = of(event).pipe(delay(50));
    observable.subscribe(() => {
      this.matTabs.selectedIndex = event.index;
    });
  }
}

相关内容

热门资讯

德州之星插件!aapoker怎... 德州之星插件!aapoker怎么设置牌局,wepower使用说明书,线上教程(有挂攻略)是一款可以让...
wepoke模拟器!wopok... wepoke模拟器!wopoker辅助器ios,wepoke 软件,微扑克教程(有挂方法)1、在we...
智星德州菠萝外挂!德州辅助软件... 智星德州菠萝外挂!德州辅助软件线上,cloudpoker外挂,规律教程(有挂教学)1、不需要AI权限...
wepoke辅助德之星!wpk... wepoke辅助德之星!wpk透视辅助封号吗,wpk外挂存在,安装教程(有挂攻略);人气非常高,ai...
wpk发牌逻辑!wepoke有... wpk发牌逻辑!wepoke有辅助挂吗,微扑克辅助工具可以下载,技巧教程(有挂了解),您好,wepo...
aapoker俱乐部!菠萝德州... aapoker俱乐部!菠萝德州辅助软件,wepower有外挂,切实教程(有挂教程)1、aapoker...
智星德州菠萝外挂!pokerx... 智星德州菠萝外挂!pokerx机器人,wepoke软件透明挂多少钱,解密教程(有挂规律)1、智星德州...
wepoke ai辅助!微扑克... wepoke ai辅助!微扑克wpk,微扑克ai操作,2025版教程(有挂详情)1、不需要AI权限,...
wpk透视辅助测试!aapok... wpk透视辅助测试!aapoker系统机制,wepoke是有辅助,切实教程(有挂规律)1.wpk透视...
wepoke一定有挂!德扑ai... wepoke一定有挂!德扑ai助手软件,德州wepower透视辅助,技巧教程(有挂透明)1、wepo...