Angular UI $ tooltipProvider setTriggers

Question

我試圖將一組新的觸發器（顯示和隱藏）添加到我的Angular UI工具提示中。 但是，它們不起作用。 我應該怎么做？ 這是一個矮人：

http://plnkr.co/edit/ihy7PcB2kwvlJgC1QZ9p?p=預覽

相關代碼為：

var app = angular.module('plunker', ['ui.bootstrap'])
.config(['$tooltipProvider', function($tooltipProvider){
$tooltipProvider.setTriggers({
    'show': 'hide'
});
}]);

謝謝！

Answer 1

我對您的Plunker進行了更新 ，使其能夠正常運行，並進行了兩個關鍵更改：

依存順序

更改依賴項加載順序以在其他腳本之前加載jQuery。 我不知道為什么會有所作為，但是確實如此。 之前：

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.js"></script>
<script data-require="jquery@*" data-semver="2.0.3" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<script data-require="ui-bootstrap@0.10.0" data-semver="0.10.0" src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.10.0.js"></script>
<script src="script.js"></script>
<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" rel="stylesheet">
<link rel="stylesheet" href="style.css" />

后：

<script data-require="jquery@*" data-semver="2.0.3" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.js"></script>
<script data-require="ui-bootstrap@0.10.0" data-semver="0.10.0" src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.10.0.js"></script>
<script src="script.js"></script>
<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" rel="stylesheet">
<link rel="stylesheet" href="style.css" />

使用超時

超時觸發事件，這是下面引用的演示中使用的一種技術。 沒有超時，我得到了一個Angular錯誤$apply already in progress 。

app.controller('MainCtrl', function($scope, $timeout) {
  $scope.runmef = function(eventName) {
    $timeout(function () {
      console.log("Toggling tooltip: " + eventName);
      $("#myid").trigger(eventName);
    }, 0);
  }
});

參考

靈感來自於在Angular-UI問題討論中引用的自定義工具提示事件Plunker 。 我推薦它。