我试图在我的<a>
上悬停,如here所示,在自定义指令中显示。但是它没有让我成为popover.what在这里出了问题。检查小提琴看到我的整个指令定义。
template: '<h1><a popover-placement="bottom" popover="sd" popover-trigger="mouseenter">{{pages}}</a></h1>',
答案 0 :(得分:3)
您需要添加UI Bootstrap依赖项。所以你的模块定义应该是:
var MyDirectives = angular.module('testapp', ['ui.bootstrap']);
答案 1 :(得分:0)
你需要做两件事:
添加模块依赖项,使其能够找到popover
为引导程序添加css以获得更好的视觉效果
HTML:
<div ng-app="testapp">
<div ng-controller="testCtrlr">
<div mdpagination pages="pages"></div>
</div>
</div>
控制器:
var MyDirectives = angular.module('testapp', ['ui.bootstrap']);
MyDirectives.controller('testCtrlr', ['$scope', function ($scope) {
$scope.pages = 'hover me to get popover'
}]);
MyDirectives.directive("mdpagination", function () {
console.log('DIRECTIVE!');
return {
template: '<h1><a popover-placement="bottom" popover="sd" popover-trigger="mouseenter">{{pages}}</a></h1>',
replace: true,
restrict: 'A',
// scope: {pages:'@'}, //default
link: function (scope, element, attrs) {
console.dir(scope.pages);
}
}
});