Bootstrap工具提示无法使用角度ng-repeat进行渲染

Question

我正在尝试为通过Hero创建的表格的第一行创建tooltip 但是工具提示没有渲染。

HTML

ng-repeat.

Answer 1

这是因为angularjs使用ng-repeat（数据绑定）动态添加/删除元素。

为了避免这种情况，您需要创建一个指令，以便无论何时创建新元素，都可以正确启动工具提示。

首先，您需要创建以下指令：

app.directive('bsTooltip', function(){
    return {
        restrict: 'A',
        link: function(scope, element, attrs){
            $(element).hover(function(){
                // on mouseenter
                $(element).tooltip('show');
            }, function(){
                // on mouseleave
                $(element).tooltip('hide');
            });
        }
    };
});

然后包括＆＃34;工具提示＆＃34;您希望工具提示出现在元素上的属性：

<a href="" title="My Tooltip!" bs-tooltip>My Tooltip Link</a>

来源：Using Bootstrap Tooltip with AngularJS