这个问题与之前的问题有关,这个问题不再被关注,因为它有一个向上投票的答案:改变jQuery旋钮的最小/最大值
下面的代码是jQuery旋钮插件的包装。我知道现有的角包装器,但我使用它来进一步了解角框架。无论如何,我的问题是,当$watch()检测到旋钮的最小值和最大值的变化时,触发的变化事件会导致角内的某种碰撞,导致$digest已经在进行中的错误。注释掉change函数中的这两行并不能停止错误,但是注释掉$(elem).trigger('change');行。这打破了我最初的假设,即scope.$apply()是原因。如果有人知道这里发生了什么,任何信息都会很感激。谢谢你。
App.directive('knobWidget', function () {
return {
scope: {
minbinding: "=minbinding",
minbindingprop: "@minbindingprop",
maxbinding: "=maxbinding",
maxbindingprop: "@maxbindingprop",
delta: "@delta"
},
restrict: 'A',
require: 'ngModel',
link: function (scope, elem, attrs, ngModel) {
ngModel.$render = function () {
$(elem).val(ngModel.$viewValue)
$(elem).trigger("change");
};
$(elem).knob({
min: 0,
max: 1,
value: ngModel.$viewValue,
change: function (changeVal) {
ngModel.$setViewValue(changeVal);
scope.$apply();
}
});
scope.$watch(function () { return scope.maxbinding[scope.maxbindingprop] }, function (newVal) {
$(elem).trigger('configure', { 'max': scope.maxbinding[scope.maxbindingprop] + parseInt(scope.delta) });
$(elem).trigger('change');
});
scope.$watch(function () { return scope.minbinding[scope.minbindingprop] }, function (newVal) {
$(elem).trigger('configure', { 'min': scope.minbinding[scope.minbindingprop] + parseInt(scope.delta) });
$(elem).trigger('change');
});
}
};
});
不要使用$timeout使用作用域。$ $阶段而不是
if(!scope.$$phase){
scope.$apply();
}
这将防止循环,而不会使代码异步。如果当前处于摘要循环中,则不需要调用apply