滑块在角度范围滑块中停止时如何调用函数

Tapan Bavaliya 发表于 Dev

塔潘·巴瓦利亚

我正在使用滑块https://github.com/danielcrisp/angular-rangeslider

我的问题是，例如，当滑块停止时如何调用控制器功能

<div range-slider min="0" max="100" model-min="min" model-max="max"></div>

那么当滑块停止时如何在此滑块中绑定事件？

我找到这样的东西

scopeOptions = {
                    disabled: '=?',
                    min: '=',
                    max: '=',
                    modelMin: '=?',
                    modelMax: '=?',
                    onHandleDown: '&', // calls optional function when handle is grabbed
                    onHandleUp: '&', // calls optional function when handle is released
                    orientation: '@', // options: horizontal | vertical | vertical left | vertical right
                    step: '@',
                    decimalPlaces: '@',
                    filter: '@',
                    filterOptions: '@',
                    showValues: '@',
                    pinHandle: '@',
                    preventEqualMinMax: '@',
                    attachHandleValues: '@'
                };

卡尔汉·托雷斯

您可以选择作为问题，在那里您可以找到一个叫做的东西onHandleUp，它被描述为calls optional function when handle is released。因此，如果将函数传递给此选项，则在滑块停止时将调用该函数。

例如：

添加on-handle-up选项，

<div range-slider min="0" max="100" model-min="demo1.min" model-max="demo1.max" on-handle-up="sliderStops()"></div>

sliderStops()在控制器中创建功能，

 $scope.sliderStops = function() {
  alert("slider stops.");
}

这是演示柱塞

如果您需要在滑块启动时调用函数，请使用useonHandleDown选项，与相同onHandleUp。

<div range-slider min="0" max="100" model-min="demo1.min" model-max="demo1.max" on-handle-up="sliderStops()" on-handle-down="sliderStats()"></div>

$scope.sliderStats = function() {
    console.log("slider starts.");
}

这是演示柱塞。打开控制台并滑动并检查控制台输出。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。