首页 > 解决方案 > Angular 8 步进器集合

问题描述

如何从步进器数组中识别步进器并在该步进器上设置步进索引。例如,我通过 *ngFor 循环生成了 4 个步进器,this.stepper 始终指向第一个步进器,this.stepper.selectedIndex 用于第一个步进器而不是第 n 个步进器。如何选择正确的步进器来更改索引?

<div *ngFor="let item of items; let i = index">
        <mat-vertical-stepper #stepper >
          <mat-step  label="Order Received:" state="phone">
            <mat-card >
              <p class="blinkme">Order Received</p>
            </mat-card>
          </mat-step>
      
          <mat-step label="Order Processing:" state="order">
            <mat-card>
                Order Processing---
                 <p class="blinkme">  Order Time + {{SP}} Minutes </p>
            </mat-card>
          </mat-step>
        </mat-vertical-stepper>
      </div>

所以对于 4 个项目,我有 4 个扩展面板代码未显示每个面板都有项目项目最终结果是 4 个步进器嵌入在扩展面板中。问题是 this.stepper.selectedIndex = index; 总是指向第一个步进器,但看看函数我可以看到 4 个阵列步骤,每个步骤都有一个垂直步进器。我需要进入第 N 步,以便在用户选择第 N 扩展面板时设置它的索引。

标签: angularstepper

解决方案


推荐阅读