Javascript 为什么在手表表达式中更新滑块选项时，AngularJS滑块（rzslider）不能正确更新？

我有一个设置为默认值的rzslider

HTML:

在Watch表达式中，有更新滑块选项的代码：

$scope.$watch('foo', function () {
    $scope.slider.value = 0;
    $scope.slider.options.floor = 0;
    $scope.slider.options.ceil = foo.length;
}

在运行watch表达式中的代码之后，我希望滑块的天花板选项会更改。但是，即使已正确更新了

$scope.slider

的值，更改也不会显示在滑块上

我尝试重新呈现页面上记录的滑块，但它无法解决问题

$scope.refreshSlider = function() {
  $timeout(function() {
    $scope.$broadcast('rzSliderForceRender')
  })
}

---

经过一番挖掘，我们发现这是一个时间问题。请注意，当rzslider设置为默认值并且在同一摘要循环中由watch表达式更新时，这只是第一个角度摘要循环中的问题

rzslider更新选项代码和角度观察表达式代码的组合会导致rzslider在第一个摘要周期中错过更新

这是rzslider更新选项代码：

this.scope.$watch('rzSliderOptions()', function(newValue, oldValue) {
    if (newValue === oldValue)
        return;
    self.applyOptions(); // need to be called before synchronizing the values
    self.syncLowValue();
    if (self.range)
        self.syncHighValue();
    self.resetSlider();
}, true);

 watch.fn(value, ((last === initWatchVal) ? value : last), current);

这是调用rzslider更新选项代码的角度手表表达式代码：

this.scope.$watch('rzSliderOptions()', function(newValue, oldValue) {
    if (newValue === oldValue)
        return;
    self.applyOptions(); // need to be called before synchronizing the values
    self.syncLowValue();
    if (self.range)
        self.syncHighValue();
    self.resetSlider();
}, true);

 watch.fn(value, ((last === initWatchVal) ? value : last), current);

在第一个摘要循环中，

last

等于

initWatchVal

，因为（根据角度）没有变化。

这意味着rzslider代码中的

newValue

和

oldValue

都包含滑块选项的更新版本。比较这些值时，函数在调用

self.applyOptions（）之前返回，这将更新滑块

有两种可能的解决方案：

在第一个摘要循环完成运行后更新滑块选项。这可以通过超时或向按钮单击事件添加更新代码来完成

在滑块选项已更新后渲染滑块。我们通过将rzslider放入
ng if
中实现了这一点。rzslider是在显示元素时从一开始就使用更新的值创建的

看起来这个应该很好用。如何检查$scope.slider是否正确更新？我在滑块上方的HTML中显示slider.options.ceil，以查看值应该是多少。