自定义AngularJS引导工具提示

Customize AngularJS Bootstrap Tooltip

本文关键字：工具提示 AngularJS 自定义      更新时间：2023-09-26

如何在AngularJS/Bootstrap工具提示中添加自定义位置/动画?我可以:

myApp.controller('TooltipCtrl', function ($scope) {
  $scope.htmlTooltip = 'Here is a tooltip!';
});

效果很好，但是如果我加上:

$scope.setTriggers({
  placement: 'right'
});

在控制器内，我得到一个"未定义的不是一个函数"错误。我在语法上做错了什么?

编辑:

我也试过这样做:

myApp.controller('TooltipCtrl', function ($scope) {
  $scope.placement = 'right';
  $scope.htmlTooltip = 'Here is a tooltip!';
});

但是它似乎对工具提示的位置没有影响。

如果您正在尝试配置"$tooltipProvider"。

$tooltipProvider是一个提供商，因此只能在angular的CONFIG阶段配置。

你必须尝试在angular的CONFIG阶段设置它。

    angular.module('yourApp', ['ui.bootstrap'])
        .config(['$tooltipProvider', function ($tooltipProvider) {
        $tooltipProvider.options({
            placement: 'right'
        });
    }])

Angular $tooltipProvider已更改为$uibTooltipProvider。试试这个。

angular.module('yourApp', ['ui.bootstrap'])
.config(['$tooltipProvider', function ($uibTooltipProvider)
{
   $tooltipProvider.options({
   placement: 'right'
  });
}]);
相关文章：