完整案例，参考http://www.cnblogs.com/pilixiami/p/5661600.html
<!DOCTYPE html> <html ng-app="ui.bootstrap.demo" xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link href="/Content/bootstrap.css" rel="stylesheet" /> <title></title> <script src="/Scripts/angular.js"></script> <script src="/Scripts/ui-bootstrap-tpls-1.3.2.js"></script> <script> angular.module('ui.bootstrap.demo', ['ui.bootstrap']).controller('TooltipDemoCtrl', function ($scope, $sce) { $scope.htmlTooltip = $sce.trustAsHtml('代码示例 <code>id:5</code>'); $scope.text = "一些文本"; }); </script> <script type="text/ng-template" id="myTooltipTemplate.html"> <div>使用模板的提示框<strong>markup</strong>{{ text }}</div> </script> </head> <body style="padding:30px"> <div ng-controller="TooltipDemoCtrl"> <div class="form-group"><button tooltip-placement="right" uib-tooltip="文本提示框" type="button" class="btn btn-default">按钮</button></div> <div class="form-group"><a href="#" uib-tooltip-html="htmlTooltip">使用html的提示框</a></div> <div class="form-group"><input type="text" uib-tooltip-template="'myTooltipTemplate.html'" value="模板提示框"/></div> </div> </body> </html>