AngularMaterialTabs-新添加的Tab只显示一半
创始人
2024-10-28 10:34:31
0

这个问题可能是因为您添加的新Tab没有被正确地添加到Tab的列表中,导致Tab的宽度没有被正确计算,从而只显示了一半。

您可以尝试通过以下代码,在新Tab被添加后,手动让Tab重新计算自己的宽度。

import { Component, ViewChild } from '@angular/core';
import { MatTabGroup } from '@angular/material/tabs';

@Component({
  selector: 'app-tab-example',
  templateUrl: 'my-tab-group.component.html',
})
export class MyTabGroupComponent {
  @ViewChild(MatTabGroup) tabGroup: MatTabGroup;

  onNewTabAdded() {
    // 重新计算Tab的宽度
    this.tabGroup.realignInkBar();
  }
}

在这个代码示例中,我们通过@ViewChild装饰器,获取了在模板中定义的MatTabGroup组件的引用。在新Tab被添加后,我们调用了realignInkBar()方法,让Tab重新计算自己的宽度。

注意:在使用@ViewChild获取组件引用时,需要确保模板中该组件已经被正确地声明和初始化。

相关内容

热门资讯

透视app!模拟器打开hhpo... 透视app!模拟器打开hhpoker,wepoker辅助分析器(透视)专业教程(有挂分析)-哔哩哔哩...
有玩家发现!hhpoker脚本... 有玩家发现!hhpoker脚本,wepoker安装教程(透视)解密教程(有挂详细)-哔哩哔哩1、点击...
透视有挂!wepoker辅助工... 透视有挂!wepoker辅助工具,xpoker怎么辅助(透视)总结教程(证实有挂)-哔哩哔哩1、用户...
透视真的!佛手在线大菠萝技巧,... 透视真的!佛手在线大菠萝技巧,wejoker透视方法(透视)推荐教程(发现有挂)-哔哩哔哩1、该软件...
今天上午!wepoker有透视... 今天上午!wepoker有透视吗,we-poker辅助软件教程(透视)详细教程(有挂教学)-哔哩哔哩...
最新消息!wepoker永久免... 最新消息!wepoker永久免费脚本,wepoker辅助器下载(透视)专业教程(有挂总结)-哔哩哔哩...
此事备受玩家关注!有哪些免费的... 此事备受玩家关注!有哪些免费的wpk辅助码,xpoker怎么辅助(透视)了解教程(有挂方略)-哔哩哔...
此事引发网友热议!wepoke... 此事引发网友热议!wepoker好友助力码,wepoker怎么买辅助(透视)揭幕教程(确实有挂)-哔...
透视总结!哈糖大菠萝软件下载,... 透视总结!哈糖大菠萝软件下载,htx矩阵wepoker辅助(透视)解迷教程(有挂猫腻)-哔哩哔哩该软...
据目击者称!wepoker私人... 据目击者称!wepoker私人局辅助,wejoker私人辅助软件(透视)关于教程(有挂方式)-哔哩哔...