JQuery UI滑块'slide'功能未设置angularJS值

Posted 2023-05-08

【中文标题】JQuery UI滑块\'slide\'功能未设置angularJS值

【英文标题】：JQuery UI slider 'slide' function not setting angularJS valueJQuery UI滑块'slide'功能未设置angularJS值

【发布时间】：2017-01-03 11:43:16

【问题描述】：

我试图通过捕获来自 Slide 函数的值并将其设置为 AngularJS $scope 变量来显示其下方的滑块值，但它不起作用。

这是我的 JS 代码 sn-p:

$( "#price-slider" ).slider(
    range: true,
    min: 0,
    max: 1000000,
    values: [ 10000,  500000],
    slide: function( event, ui ) 
        $scope.price_gt = ui.values[0];
        $scope.price_lt = ui.values[1];
    
);

html：

<div id="price-slider"></div>
<p style="text-align: center">&#8377; price_gt - &#8377; price_lt</p>

谁能帮我理解我哪里出错了？我基本上需要在用户移动幻灯片并显示它时动态获取值。

【参考方案1】：

试试这个

<input type="text" id="price_gt" size="auto" readonly style="border:0; color:black; font-weight:bold;  width:100% " /> 

【讨论】：

这根本没有帮助，也不是 AngularJS AFAIK 的工作方式

【参考方案2】：

原来问题出在 AngularJs 而不是 JQuery Slider。

进行此更改解决了我的问题：

slide : function(event, ui) 
            $scope.$apply(function() 
                $scope.price = 
                        lower_limit : ui.values[0],
                        upper_limit : ui.values[1]
                ;
            );