mat-tab-group - 设置初始标签funcky

时间:2018-04-03 03:38:50

标签: angular angular-material2

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

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

selectedTabIndex绑定到选项卡组:

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

因此,问题是,当对话框加载时,会选择第3个选项卡,但选项卡的内容会闪烁并消失。手动选择第二个选项卡是相同的,但第一个选项卡没问题。

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

就像我说的那样......真是太棒了!

任何人都有线索?

1 个答案:

答案 0 :(得分:0)

我制作了一个Stackblitz demo来展示问题和解决方案:当以这种方式使用AfterViewInit生命周期挂钩时,您会在检查后更改“&#39;表达式”。错误,但之所以没有出现在控制台中是因为setTimeout调用实际上是在Angular的视图之外进行更改而不会导致错误浮出水面。将selectedIndex逻辑移动到OnInit生命周期挂钩(并删除对setTimeout的调用)可以解决您的问题。