angular-material - angular material 2 stepper mat-step - 包含在父 div 中

Question

在我的表格中，我有一系列申请人。对于每个申请人，我想展示一个“mat-step”（角度材料 2 步进器）并有一个带有 formArrayName="applicants" 的父 div。但是当我用 div 或 ng-container 包围“mat-step”时，它不会显示该步骤。

<mat-step label="Step 1">
</mat-step>
<ng-container formArrayName="applicants">
    <mat-step *ngFor="let applicant of applicants.controls; let i=index">
    </mat-step>
</ng-container>

我希望上面的代码能够显示申请人的垫步次数。

垫步不显示

Answer 1

mat-step 应该由 mat-h​​orizo​​ntal-stepper 或 mat-vertical-stepper 包围

例如

<mat-horizontal-stepper #stepper="matHorizontalStepper">
    <mat-step [stepControl]="firstStep">
        <form [formGroup]="firstStepFormGroup">
        .............
        </form>
    </mat-step>
    <mat-step [stepControl]="secondStep">
        <form [formGroup]="secondStepFormGroup">
        .............
        </form>
    </mat-step>
</mat-horizontal-step>