ng-repeat 中的 div 未显示 AngularUI 的工具提示

Question

我正在尝试使用 AngularUI 在网站的某些 div 上显示工具提示。目标是在用户进入网站时已经显示它们。这就是 tooltop-is-open 设置为 true 的原因。但是，这不适用于重复组中的元素（即通过 ng-repeat 创建的 div）。我错过了什么？

这是HTML：

<script >
angular.module('testApp', ['ui.bootstrap']);

angular.module('testApp')
.controller('testController', ['$scope', function($scope) {

    $scope.demo = [1, 2, 3, 4, 5, 6];

}]);
</script>

<!DOCTYPE html>
<html lang="en" ng-app="testApp">
    <head>
        <meta charset="utf-8">
        <title>Hello World</title>

        <script src="bower_components/angular/angular.min.js"></script>
        <script src="bower_components/angular-animate/angular-animate.min.js"></script>
        <script src="bower_components/angular-sanitize/angular-sanitize.min.js"></script>
        <script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.min.js"></script>
        <link rel="stylesheet" href="bower_components/bootstrap-css-only/css/bootstrap.min.css"/>
        <script src="index.js"></script>

    </head>
    <body ng-controller="testController" >

        <!-- works -->
        <div >
            <h1 uib-tooltip="hallo" 
             tooltip-is-open="true" 
             tooltip-placement="bottom">Title</h1>
        </div>

        <!-- does not work -->        
        <div ng-repeat="a in demo">
            <h2 uib-tooltip="hallo"
                 tooltip-is-open="true" 
                 tooltip-placement="bottom">{{ a }}</h2>
        </div>

    </body>
</html>

Answer 1

改为在 ngRepeat 中使用 uib-tooltip-html：

<div ng-repeat="a in demo">
    <h2 uib-tooltip-html="'hallo'" tooltip-is-open="true" tooltip-placement="bottom">
        {{ a }}
    </h2>
</div>

看起来像一个错误

ng-repeat 中的 div 未显示 AngularUI 的工具提示

Tooltip of AngularUI not shown for divs within ng-repeat

html

javascript

angularjs

angular-ui

angular-ui-bootstrap