我正在尝试为通过ng-repeat创建的表的第一行创建工具提示.
但工具提示不是渲染.
但工具提示不是渲染.
<tr ng-repeat="item in govtFiltered> <td class="name" data-toggle="tooltip" data-content="{{item.hospitalName}}" title="{{item.hospitalName}}"></td> </tr> <script> $(document).ready(function () { $('[data-toggle="tooltip"]').tooltip(); }); </script>
这是因为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'); }); } }; });
<a href="" title="My Tooltip!" bs-tooltip>My Tooltip Link</a>