动态删除选项卡时如何重新触发选项卡组幻灯片动画

时间:2018-10-01 07:47:30

标签: angular angular-material-6

我有一个带有角varPlus材质6.4.7组件的案例,客户可以从其mat-tab-group动态删除一些项目。当选择一个选项卡时,该选项卡显示在列表的右侧,并且删除了项目,此时幻灯片动画不再起作用。在这种情况下是否可以重新触发动画?

Stackblitz上的代码示例

https://stackblitz.com/edit/angular-88gk9w

控制器代码

array[]

模板代码

import {Component} from '@angular/core';
import {FormControl} from '@angular/forms';

@Component({
  selector: 'tab-group-dynamic-example',
  templateUrl: 'tab-group-dynamic-example.html',
  styleUrls: ['tab-group-dynamic-example.css'],
})
export class TabGroupDynamicExample {
  tabs = ["Item000", "Item001", "Item002", "Item003", "Item004", "Item005", "Item006", "Item007", "Item008", "Item009", "Item010", "Item011", "Item012", "Item013", "Item014", "Item015", "Item016", "Item017", "Item018", "Item019", "Item020", "Item021", "Item022", "Item023", "Item024", "Item025", "Item026", "Item027", "Item028", "Item029", "Item030", "Item031", "Item032", "Item033", "Item034", "Item035", "Item036", "Item037", "Item038", "Item039", "Item040", "Item041", "Item042", "Item043", "Item044", "Item045", "Item046", "Item047", "Item048", "Item049", "Item050", "Item051", "Item052", "Item053", "Item054", "Item055", "Item056", "Item057", "Item058", "Item059", "Item060", "Item061", "Item062", "Item063", "Item064", "Item065", "Item066", "Item067", "Item068", "Item069", "Item070", "Item071", "Item072", "Item073", "Item074", "Item075", "Item076", "Item077", "Item078", "Item079", "Item080", "Item081", "Item082", "Item083", "Item084", "Item085", "Item086", "Item087", "Item088", "Item089", "Item090", "Item091", "Item092", "Item093", "Item094", "Item095", "Item096", "Item097", "Item098", "Item099", "Item100", "Item101", "Item102", "Item103", "Item104", "Item105", "Item106", "Item107", "Item108", "Item109", "Item110", "Item111", "Item112", "Item113", "Item114", "Item115", "Item116", "Item117", "Item118", "Item119", "Item120", "Item121", "Item122", "Item123", "Item124", "Item125", "Item126", "Item127"];
  selected = new FormControl(127);

  removeTab(index: number) {
    this.tabs.splice(0, 42);
  }
}

0 个答案:

没有答案
相关问题