AngularJs: UI bootstrap tooltip

Question

Could you please help me with the ui bootstrap tooltip in angular. On hovering over button details I need to show a table. Greatly appreciate the help. Thanks.

HTML:

    var myApp = angular.module('myApp', ['pinnacaServices','ngMaterial', 'ui.router', 'ncy-angular-breadcrumb', 'md.data.table', 'anim-in-out','ngCookies', 'ngAnimate', 'ui.bootstrap']);
              <td md-cell >
                     <button >Details</button>
              </td>

Answer 1

Prepare file with your html structure, use ui tooltip as directive. It can be something like this.

<button uib-tooltip-template="'myTooltipTemplate.html'">Details</button>

Answer 2

You can also use scope variable and uib-tooltip-html to show table on tooltip

Sample is HERE