angular - 禁用 CDK Stepper 中的一个步骤/阻止返回上一步

Question

我的 Angular 应用程序中有一个 CdkStepper - 由 4 个步骤组成 - 它的行为非常规律。没有步骤是可选的，因此您不能跳过任何步骤，但用户始终可以返回上一步。

CdkStepper：https ://material.angular.io/cdk/stepper/

现在我有一个特殊情况，步进器在第 2 步直接打开，在这种情况下，我需要禁用返回上一步（第一步）的选项，同时仍然允许从 4 步退到 3 步和3比2。

我的代码类似于此处的示例： https ://stackblitz.com/edit/angular-cdk-stepper-demo

<vwlmz-stepper #stepper linear>
    <!-- Step 1 -->
    <cdk-step #step1="cdkStep">
        <ng-template cdkStepLabel>
            ...
        </ng-template>
    </cdk-step>
    <!-- Step 2 -->
    <cdk-step #step2="cdkStep">
        <ng-template cdkStepLabel>
            ...
        </ng-template>
    </cdk-step>
    <!-- Step 3 -->
    <cdk-step #step3="cdkStep">
        <ng-template cdkStepLabel>
            ...
        </ng-template>
    </cdk-step>
    <!-- Step 4 -->
    <cdk-step #step4="cdkStep">
        <ng-template cdkStepLabel>
            ...
        </ng-template>
    </cdk-step>
</vwlmz-stepper>

StackOverflow 和谷歌搜索没有给我答案。

Answer 1

真正阅读文档有时会有所帮助..

默认情况下，步骤是可编辑的，这意味着用户可以返回到之前完成的步骤并编辑他们的响应。可以在 CdkStep 上设置 editable="false" 以更改默认值。

-> https://material.angular.io/cdk/stepper/overview#types-of-steps

step1.editable = false;

做“把戏”:-)