使用ui.bootstrap作用域$ watch＆element.triggerHandler - 正在獲取 - 錯誤：[$ rootScope：inprog] $ digest已在進行中

Question

我做了一些指令以使表單字段爲無效。我遇到的唯一障礙是試圖將屬性值「評估」爲真或假，因此我可以打開或關閉彈出窗口。我是一個角色新手（只是學習），但做了一些研究，似乎使用$ scope.watch是使用的東西（也從看ng-show和ng-hide代碼）。所以，一切工作都是親愛的，直到我試圖從$ scope.watch中調用element.triggerHandler（）並使用bootstrap.ui。

這裏是我的指令：

app.directive('tooltipTriggerOn', ['$log', function($log) { 
    function link(scope, element, attrs) { 
    scope.$watch(attrs.tooltipShow, function(val) { 
     if (val) { 
      $log.info('trigger openPopup'); 
     } else { 
      $log.info('trigger closePopup'); 
     } 
     //if (val) element.triggerHandler('openPopup'); 
     //else element.triggerHandler('closePopup'); 
    }); 
    } 
    return { 
    restrict: 'A', 
    link: link 
    }; 
}]); 

的if/else語句註釋掉，使沒有問題的應用程序運行。如果我啓用這些行，我會收到javascript錯誤：

Error: [$rootScope:inprog] $digest already in progress 
Error: a.$apply(...) is not a function 

但是爲什麼？當我不使用ui.bootstrap時，這個小方案工作正常。所以：

1. 是否有一個使用範圍的技巧$ watch在我的指令並沒有得到錯誤？
2. 是否有不同的方式來'評估'指令屬性而不使用範圍$ watch？
3. 這個錯誤爲什麼會發生？

這裏是plunkrs：

這一個展示與bootstrap.ui問題，只是取消註釋if語句作爲問題描述的犯罪。

plunkr

這一個演示$ scope.watch沒有bootstrap.ui

plunkr

任何幫助表示讚賞工作！

邁克 -

Answer 1

當我遇到了$digest already in progress錯誤，我不能避免這個問題的另一種方式重寫代碼，我環繞它$timeout(function(){...})。這會導致包裝的代碼在當前摘要循環後執行（因此它不在進行中）。

又見 「AngularJS : Prevent error $digest already in progress when calling $scope.$apply()」（第2篇回覆）

$timeout(function(){ 
    if (val) element.triggerHandler('openPopup'); 
    else element.triggerHandler('closePopup'); 
    }); 

工作演示：http://plnkr.co/edit/STaPZI2f9eTaRhnsr6Qm?p=preview