Angular:使用范围滑块和数字微调器输入的oldVal和newVal之间的差异

Question

我正在尝试修复彼此绑定的"范围滑块"one_answers"数字微调器输入"中oldVal和newVal之间的差异。我注意到一个错误，其中oldVal和newVal有很大的差异。当步长设置为5时，我希望差值为1或5。

当我绑定滑块和微调器时，这个错误变得很明显，但从控制台来看，真正绑定它们只会使newVal和oldVal的潜在问题变得明显：我们将滑块向右拖动得越远，差异就越大。

以下是我试图绑定的滑块&微调器：

var spinnerVal = newVal; 
var newCss = spinnerVal / 100 + "%";
document.querySelector('.range-quantity').style.width = newCss;
document.querySelector('.range-handle').style.left = newCss;

滑块&旋转绑定

http://jsfiddle.net/PaulOD/PpCC4/4/

我不确定这是否是绑定它们的最佳方式，还有更标准的方式吗？

这里有一个小提琴，我省略了上面的代码，但它们现在没有相互绑定。我们可以看到滑块的移动更加自然，但是控制台报告oldVal和newVal之间存在相同的差异。

http://jsfiddle.net/PaulOD/PpCC4/5/

任何帮助，不胜感激。如果我能找到一种方法来针对滑块的真值控件，那也太好了，只更改css感觉有点麻烦。在jQuery中，我曾经以"ui.value"为目标，这很好地解决了这些问题，但这次我试图在没有jQuery的情况下做到这一点。

我正在使用powerange滑块。http://abpetkov.github.io/powerange/编辑：但我认为滑块的选择并不重要，因为我在这里用html范围滑块复制了错误：http://plnkr.co/edit/ke5n3x?p=preview

谢谢，Paul

Answer 1

看起来差异可能会增加，但实际上这取决于你"滑动"的速度。我记录了newVal - oldVal，根据我移动滑块的速度，数字越大。但在整个规模上都是一样的。大多数时候我都是21岁和64岁。

也许在你看来，这是因为当你滑动"更长"的时间（意味着超过视图毫秒）时，值会更新多次。

关于你如何制定指令的另一个想法：

应该使用双向绑定，而不是使用父作用域的值preview.donation。下面有一篇文章对此进行了解释：http://umur.io/angularjs-directives-using-isolated-scope-with-attributes/

干杯