爲什麼我的AngularJS指令在Edge中不起作用？

Question

此代碼在所有主流瀏覽器中均可正常工作，但Edge僅在DOM檢查器中顯示有效值，但在頁面仍舊保留舊值。爲什麼？

(function (angular, module) { 

    'use strict'; 

    module 
    .directive('psEffectsDurationSlider', EffectsDurationSlider); 

    EffectsDurationSlider.$inject = []; 

    function EffectsDurationSlider() { 
    return { 
     require: 'ngModel', 
     restrict: 'E', 
     link:  link 
    }; 

    function link(scope, element, attrs, ngModel) { 
     ngModel.$render = render; 

     activate(); 

     function initializeSlider() { 
     element.slider({ 
      min:   0.2, 
      max:   2, 
      step:  0.1, 
      animate:  true, 
      orientation: 'horizontal', 
      range:  'min', 
      slide:  onSliderChange 
     }); 
     } 

     function render() { 
     element.slider('value', ngModel.$viewValue); 
     } 

     function onSliderChange(event, ui) { 
     ngModel.$setViewValue(ui.value); 
     } 

     function onScopeDestroy() { 
     element.slider('destroy'); 
     } 

     function activate() { 
     initializeSlider(); 

     scope.$on('$destroy', onScopeDestroy); 
     } 
    } 
    } 

})(window.angular, window.angular.module('...')); 

從邊緣截圖與在DOM檢查，並在頁面有效值無效結果：

Answer 1

嘗試包裝模型更新中$timeout由於滑塊事件是角上下文之外

function onSliderChange(event, ui) { 
    $timeout(function(){ 
     ngModel.$setViewValue(ui.value); 
    }); 
    } 

還需要注入$timeout