物料步进器选择的索引无法正常工作

时间:2018-12-05 13:44:25

标签: javascript angular typescript angular-material

您好,我目前正在研究Mat-Stepper。好吧,其中两个。你看我有这个组件,它拥有两个这样的ng-templates:

将问题推到顶部:为什么我选择的索引不起作用是我想念的东西。我知道您可以在步进器上定义TypeError: unsupported operand type(s) for -: 'QuerySet' and 'QuerySet' ,但我认为我认为它可以正常工作。感谢帮助

[selectedIndex]="condition"

verticalStepper:

<div *ngIf="!isSmallScreen; then horizontalStepper else verticalStepper"></div>

水平步进器:

<ng-template #verticalStepper>
 <mat-vertical-stepper [linear]="isLinear"
                    style="z-index: 1; display: inline;"
                    class="container-fluid width-limit">
      <mat-step [completed]="condition1"></matstep>
      <mat-step [completed]="condition2"></matstep>
 </mat-vertical-stepper>
</ng-template>

这是我父母应该处理的选定索引的功能

<ng-template #horizontallStepper>
 <mat-horizontal-stepper [linear]="isLinear"
                     style="z-index: 1; display: inline;"
                     class="container-fluid width-limit">
       <mat-step [completed]="condition1"></matstep>
       <mat-step [completed]="condition2"></matstep>
 </mat-vertical-stepper>
</ng-template>

此函数应设置索引但不起作用

ngAfterViewInit() {
  if (!conition1) {
    this.move(0);
  } else if (condition1) {
    this.move(1);
  } else if (condition2) {
    this.move(2);
  } 
}

对于变量smallscreen:

move(index: number) {
  if (this.isSmallScreen) {
    this.verticalStepper.selectedIndex = index;
  } else {
    this.horizontalStepper.selectedIndex = index;
  }
}

这些是我的视线孩子

@HostListener('window:resize', ['$event'])
  onResize(event) {
    if (event.target.innerWidth >= 600) {
      this.isSmallScreen = false;
    } else {
      this.isSmallScreen = true;
    }
  }

0 个答案:

没有答案