工具提示永远不会关闭时的状态变化

Question

我做了面包屑：

Home > Page 1 > Page 1.1

在每个父页面（Home，Page 1）我想显示包含在本网页细节的引导提示。这工作正常。但是，当我点击Tab键直到我到达一个链接到另一个页面的按钮并点击Enter时，页面会改变，但工具提示保持打开状态，并且永远不会关闭，即使我回到页面并在任何地方点击也是如此。

这里是模板：

<a ui-sref="home" 
    title="Home" 
    class="btn btn-default contains-tooltip"> 
     <span class="fa fa-home"></span> 
</a> 
<a ng-repeat="page in breadcrumb" 
    ui-sref="{{ page.href }}" 
    class="btn btn-default contains-tooltip" 
    title="{{ page.description }}" 
    ng-bind-html="page.title"></a> 

和相关的JS：

$('.contains-tooltip').tooltip({ 
    container: 'body', 
    html: true, 
    trigger: 'hover', 
    placement 'bottom' 
}); 

Answer 1

$(...).tooltip是不知道的状态的变化，因为它是外面角。你必须强制隐藏工具提示。

添加一个事件侦听器，该事件侦听器将在路由更改时隐藏所有工具提示。

app.module('myApp').run(function($rootScope) { 
    $rootScope.$on('$routeChangeStart',function() { 
     $('.contains-tooltip').tooltip('hide'); 
    }); 
});