Angular UI tooltip in ng-repeat not closing

问题

Please see the plunker below: http://plnkr.co/edit/RPpjULZsSDnTFPKiafl2

Basically, the angular-ui tooltip remains when moving up / down to a position where ng-disabled is true. Any thoughts on how to fix the issue would be much appreciated!

I'm using Chrome, but the issue appears more serious in Firefox where even with ng-disabled removed the tooltips still remain on mouseleave.

回答1:

You can use the $tooltipProvider and alter the trigger map to take click as an additional hide trigger for the mouseenter show trigger:

myApp.config(['$tooltipProvider', function($tooltipProvider){
  $tooltipProvider.setTriggers({
    'mouseenter': 'mouseleave click'
  });
}]);

v0.9.0 of AngularUI suffered from this issue which caused errors (although still worked) on delete buttons (for instance) which had a tooltip. This has been subsequently fixed in v0.10.0.

Here's a demo of it in action

回答2:

I assume ng-disabled also disables any events from triggering on the buttons. Then, when you move a row down to the last row (or up to the first), the event handlers are disabled before the mouseout event is handled. It works if you trigger the mouseout event "manually" when the click event is handled.

plunker

This may actually be a bug worth pointing out to the angular team.

来源：https://stackoverflow.com/questions/23365981/angular-ui-tooltip-in-ng-repeat-not-closing