如何直接使用带有angularjs的twitter bootstrap popover?

时间:2015-07-15 21:48:35

标签: javascript angularjs twitter-bootstrap

例如我有这个文件

<!-- 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>

这个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'}},
    ];
}]);

我也有活动

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

我试图使用指令,但也没有任何效果。我做错了什么?

1 个答案:

答案 0 :(得分:2)

Angular-Bootstrap是实现您所寻找目标的最佳方式。