如何在禁用状态下自定义ion-range?

How to customize ion-range in disabled state?

有没有办法自定义 ion-range 禁用 属性 活动?

使用 ion-range 作为视觉提示来显示用户在(订购)过程中的位置。用户将没有更改范围的选项,因此添加了 disabled 属性。此 属性 覆盖所有自定义颜色 css。但是我找不到 disabled css 来再次将其覆盖为所需的结果。

这是ion-range的习俗css。副色就是下面看到的绿色。

我们能否通过用户无法控制滑块的ion-range实现下面想要的结果?

<ion-range value="{{ range }}" min="0" max="2" color="secondary" disabled></ion-range>

结果(禁用属性)

想要的结果(没有禁用属性)

编辑

由于您无法更改已禁用的 属性 并且它是 css 变量,我们希望在没有指针或用户触摸控制的情况下显示滑块。

pointer-events:none 阻止您与其互动

<ion-range style="pointer-events: none;"value="{{ range }}" min="0" max="2" color="secondary"></ion-range>

:) 我的最终答案

只需添加样式="pointer-events: none;"