Angular.js with Bootstrap Popover
An attempt to use Boostrap's Popover.js with Angular.js
HTML
<script src="http://twitter.github.com/bootstrap/1.4.0/bootstrap-twipsy.js"></script>
<script src="http://twitter.github.com/bootstrap/1.4.0/bootstrap-popover.js"></script>
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/1.4.0/bootstrap.min.css">
<script type="text/javascript" ng:autobind src="http://code.angularjs.org/1.0.0rc4/angular-1.0.0rc4.js"></script>
<div ng-app="myModule" ng-controller="MyCtrl">
<ul>
<li ng:repeat="i in ['a']">
<a href="#" bs-popover="" class="btn danger" rel="popover" data-content="Hello! It's working!" data-original-title="With Angular" data-placement="below">hover for popover</a>
</li>
</ul>
</div>
CSS
li {
margin-top: 20px;
text-align: center;
list-style: none;
}
JavaScript
angular.module('myModule',[]).directive('bsPopover', function(){
return function(scope, element, attrs) {
element.popover();
};
});
function MyCtrl(){}