How to use Angular UI Bootstrap Tooltip

Question

I want to use Angular UI Bootstrap Tooltip ui.bootstrap.tooltip separated.

I'm able to use tooltip by adding full ui-bootstrap file, like:

<script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.13.0.js"></script>
<script>var App = angular.module("App", ['ui.bootstrap']);</script>

But I want to include only tooltip functionality instead of adding full UI Bootstrap featured.

ui.bootstrap is a module .. you need to add it as a dependency to use tooltip. You cant separate it — selvakumar, Commented Jul 5, 2017 at 9:59
See the answer i have posted. Please take care of the "external resources" included in the JSfiddle. You need to include those in your project for making it to work. — Ankit Agarwal, Commented Jul 5, 2017 at 9:59
I want to grab particular set of codes which has been used for tooltip instead of adding complete ui-bootstrap-tpls-0.13.0.js — om_jaipur, Commented Jul 5, 2017 at 10:10

Arun Sahani · Accepted Answer · 2017-07-05 09:59:50Z

2

Use like this:

angular.module("App", ['ui.bootstrap.tooltip']);

it will load only tooltip library.

answered Jul 5, 2017 at 9:59

Arun Sahani

726 bronze badges

Add a comment |

Ankit Agarwal · Accepted Answer · 2017-07-05 09:57:53Z

You can use this block of code

<div ng-app="myApp" ng-controller="TooltipDemoCtrl">
  <div class="well">
    <div>Dynamic Tooltip Popup Text <input type="text" ng-model="dynamicTooltip"></div>
    <div>Dynamic Tooltip Placement <input type="text" ng-model="dynamicTooltipPlacement"></div>
    <p>
      Need some <a><span tooltip="{{dynamicTooltip}}" tooltip-placement={{dynamicTooltipPlacement}}>tips</span></a> ?
    </p>
  </div>
</div>

Controller

var app = angular.module('myApp', ['ui.bootstrap']);
var TooltipDemoCtrl = function ($scope) {

  $scope.dynamicTooltip = "Here is the help";
  $scope.dynamicTooltipText = "tips";

};

Here is the working link to JSFIDDLE to see it working.

Collectives™ on Stack Overflow

How to use Angular UI Bootstrap Tooltip

2 Answers 2

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Related