代码之家  ›  专栏  ›  技术社区  ›  Jonesie

材料选项卡组-设置初始选项卡功能

  •  -1
  • Jonesie  · 技术社区  · 7 年前

    我在一个组中有3个选项卡。 加载对话框时,如果有数据传递到对话框,我想选择第三个选项卡,即:

      ngAfterViewInit() {
        setTimeout(() => {
          if (this.data != null && this.data.imageFileID) {
            this.selectedTabIndex = 2;
          }
        });
      }
    

    selectedTabIndex绑定到选项卡组:

    <mat-tab-group #tabs [(selectedIndex)]="selectedTabIndex" ...
    

    因此,问题是,当对话框加载时,选择了第三个选项卡,但选项卡的内容会闪烁和消失。手动选择第二个选项卡也可以这样做,但第一个选项卡可以。

    我没有任何逻辑在标签中隐藏整个内容。

    就像我说的。。。是funcky!

    有人有线索吗?

    1 回复  |  直到 7 年前
        1
  •  0
  •   p4r1    7 年前

    我做了一个 Stackblitz demo 展示问题和解决方案:以这种方式使用AfterViewInit生命周期挂钩时,会导致“expression changed after checked”错误,但控制台中不会显示此错误的原因是 setTimeout 调用本质上是在Angular的视图之外进行更改,而不是导致曲面出现错误。移动 selectedIndex 将逻辑插入到OnInit生命周期挂钩中(并删除对 设置超时 )修复您的问题。