Angular uislider 禁用

Posted 2023-03-13

【中文标题】Angular uislider 禁用

【英文标题】：Angular uislider Disable

【发布时间】：2015-02-16 10:31:37

【问题描述】：

我正在使用 Angular UI Slider。滑块按预期工作。但我不知道如何禁用它。我尝试了 ng-disabled 和其他一些东西，但效果很好。

知道我应该如何禁用它吗？

【问题讨论】：

你试过 ng-disabled 了吗？

是的，它不工作！！！

【参考方案1】：

我找到了一种静态禁用滑块的方法。您必须编辑 angular-slider.js，以便函数 onMove 的第一个命令（应该从第 259 行开始）状态

if ('disabled' in attributes) return

那么你的 html 应该是这样的

<slider disabled floor=0 ceiling=100 step=1></slider>

不幸的是，您不能像使用 ng-disabled="someCondition" 时那样在运行时更改禁用状态。解决这个问题的一种方法，我最终做了类似的事情：

<div ng-if="sliderHasToBeDisabled">
    <slider disabled ...>
</div>
<div ng-if="!sliderHasToBeDisabled">
    <slider ...>
</div>

如果有更优雅干净的方式，我还是很感兴趣的。

【参考方案2】：

更新：

我刚刚看到您没有使用与我相同的 Angular UI Slider 应用程序。由于您的库不再维护，我可以推荐jQuery UI Slider for AngularJS。有了那个库，你就可以做我原来写的：

---

有

<div ui-slider="sliderOptions" ng-model="value"></div>

你可以设置sliderOptions

$scope.sliderOptions = 
    disabled: true
;

并在运行应用程序时更改$scope.sliderOptions.disabled。