Angular Material - 防止 mat-stepper 在步骤之间导航

Question

我有一个 mat-h​​orizo​​ntal-stepper，我将线性属性设置为 true。当所有步骤都有效时，我可以通过单击标题或标签导航到前面的步骤。我不想要那个属性(property)。

我只需要通过按钮进行导航。

我尝试禁用指针函数:

    .mat-horizontal-stepper-header{
       pointer-events: none;
     }

但是没有用。

我需要通过单击标题来停止导航，或者在单击步进器标题时触发一个函数。

Answer 1

您最初发布的内容:

.mat-horizontal-stepper-header{
    pointer-events: none;
}

确实有效，只要您将 ::ng-deep 添加到 CSS 类即可。像这样:

::ng-deep .mat-horizontal-stepper-header {
    pointer-events: none !important;
}

还要确保您使用的是水平步进器而不是垂直步进器。这在调用适当的 CSS 类时显然很重要。