2014-06-26 41 views
1

這一問題與上一個問題,因此不再看了,因爲它有一個upvoted答案進步的錯誤:Change jQuery Knob Min/Max value

下面的代碼是一個用於jQuery旋鈕插件的封裝。我知道現有的角包裝,但我用這個來進一步理解角框架。無論如何,所以我的問題是,當$ watch()檢測到旋鈕的最小值和最大值發生變化時,觸發的變化事件會在角度內導致某種衝突,導致$ digest已在進行中。註釋掉變化函數中的兩行不會阻止錯誤,但會註釋掉$(elem).trigger('change');線做。這打破了我最初的假設,即範圍。$ 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');    
      }); 
     } 
    }; 
}); 
+0

我想通過將更改觸發器包裝在$ timeout中來解決此問題,但我仍然對理解原因感興趣。我確信我不是唯一有這種麻煩的人。謝謝。 – AaronF

+1

使用$ timeout讓當前的摘要循環在完成另一個摘要之前完成,我認爲這是角度編程的常用做法。 –

+0

啊,這就是發生了什麼......謝謝劉燁。 – AaronF

回答

0

不要使用$超時使用範圍。$$階段,而不是

if(!scope.$$phase){ 
    scope.$apply(); 
} 

這將防止循環,不使你的代碼異步的。如果您目前處於摘要循環中,則無需調用

+0

請注意,以'$$'爲前綴的屬性應該被視爲「私有」,這意味着它們不屬於API的一部分,並且不打算用於Angular本身之外的其他用途(依賴於它們會增加代碼在升級時崩潰的風險到更新版本的Angular)。 – Strille

+0

http://stackoverflow.com/a/23102223/3063787 – AaronF