¿Cómo puedo usar twitter bootstrap popover con angularjs directamente? - javascript, angularjs, twitter-bootstrap

Por ejemplo tengo estos archivos

<!-- index.tpl.html -->
<span ng-repeat="d in data" ng-controller="clickMe">
<a href="#" class="click-me" data-data="{{d.data}}">{{d.id}}</a>
</span>

.

<!-- popover.tpl.html -->
<form>
<div ng-switch="data.option">
<div ng-swith-when="one">One</div>
<div ng-swith-when="two">Two</div>
<div ng-swith-when="three">Three</div>
</div>
</form>

Este código JS

 angular.module("myApp").controller("clickMe", ["$scope", function($scope){
$scope.data = [
{id: 1, data: {option: "one"}},
{id: 2, data: {option: "two"}},
{id: 3, data: {option: "three"}},
];
}]);

Y tambien tengo evento.

$(document).on("click", ".click-me", function(){
$(this).popover({
title: "Click Me",
content: "/** How can I render template `popover.tpl.html there?` **/"
});
});

Intenté usar directivas, pero tampoco nada funcionando. ¿Que estoy haciendo mal?

Respuestas

Angular-Bootstrap Es la mejor manera de lograr lo que buscas.