Question

我正在使用此示例- https://stackblitz.com/angular/amjgpjxbpak?file=app%2Fstepper-overview-example.ts

任何人都可以告诉我们如何在组件中获取matStepLabel名称。

Answer 1

据我所知，即使您深入探究了Angular Material源，也没有干净的解决方案。访问MatStepLabel很简单，但是实际上从中获取标签似乎几乎是不可能的。

Here 是一个显示如何访问步骤标签的堆栈式闪电战，但请注意这很丑。

它通过MatStepper访问@ViewChild，检索三个MatStepHeader，然后通过nativeElement找到实际的innerText / textContent节点。

Answer 2

您可以在 onSelectionChange 事件

上读取值

<mat-horizontal-stepper (selectionChange)="onSelectionChange($event)" [linear]="isLinear" #stepper>

在组件上

onSelectionChange($event){
   //previous step value
    console.log($event.previouslySelectedStep.stepControl.value);

    //current step value
    console.log($event.selectedStep.stepControl.value);
  }

或

您可以直接从formControl属性中读取值，如下所示。

this.firstFormGroup.controls.firstCtrl.value

https://stackblitz.com/edit/angular-stepper-demo?file=app%2Fstepper-overview-example.ts

我希望这是您正在寻找的东西

如何在Angular组件中获取MatstepLabel

2 个答案: