Angular Material Stepper 组件防止进入所有未访问的步骤

Question

我正在使用 Angular Material Stepper成分。

在我的内容中，我有单独的按钮，可帮助用户在当前步骤中的任务完成后移至下一步。

我想通过单击步进器组件的步骤按钮来阻止用户访问后续步骤。

但是，我希望用户能够通过步进器组件的步进按钮返回到上一步。

我没有在步进器内使用表单。我已经看到了组件的 Linear 属性，但它不符合我的要求。

简而言之，通过单击步进器组件的步骤按钮，防止用户进入“未访问”的步骤。

Answer 1

我发现这个问题的解决方案是使用 completed步的属性。引用下面给出的代码行:
<mat-step [completed]="isCompleted">
当isCompleted是真的，它将启用下一步。

注意:要使其正常工作，步进器组件必须位于 linear 中。模式。这可以通过设置属性 linear 来完成。在步进器组件上，例如
<mat-horizontal-stepper linear>