我试图在角度中使用uib-popover,如下所示
html模板
<form id="methodform" style="font-size:large;font-family:'merriweatherregular';color:#2c3e4c">
<label><input type="radio" ng-model="methodname" value="method1">
method1
<i title="show info" class="fa fa-info-circle"
aria-hidden="true" ng-click="getMethodInfo(1)"
uib-popover-template="dynamicPopover.templateUrl" popover-placement="right"
popover-title="{{dynamicPopover.title}}" popover-trigger="'click outsideClick'"></i></label></br>
<label><input type="radio" ng-model="methodname" value="method2">
method2
<i title="show info" class="fa fa-info-circle"
aria-hidden="true" ng-click="getMethodInfo(2)"
uib-popover-template="dynamicPopover.templateUrl" popover-placement="right"
popover-title="{{dynamicPopover.title}}"></i></label></br>
<label><input type="radio" ng-model="methodname" value="method3">
method3
<i title="show info" class="fa fa-info-circle"
aria-hidden="true" ng-click="getMethodInfo(3)"
uib-popover-template="dynamicPopover.templateUrl" popover-placement="right"
popover-title="{{dynamicPopover.title}}"></i></label></br>
</form>
<script type="text/ng-template" id="myPopoverTemplate.html">
<div>{{dynamicPopover.content}}</div>
</script>
控制器:
$scope.getMethodInfo = function(methodId){
if(methodId==1){
$scope.dynamicPopover.title = 'Method 1'
}else if(methodId==2){
$scope.dynamicPopover.title = 'Method 2'
}else{
$scope.dynamicPopover.title = 'Method 3'
}
}
$scope.dynamicPopover = {
content: 'Some details about this method',
templateUrl: 'myPopoverTemplate.html'
};
我遇到关闭popover的问题。当我使用popover-trigger
属性时,popover不会显示。但是当我删除该属性时它会起作用。我想在用户点击页面上的任意位置时关闭弹出框。我无法找到解决此问题的方法。请帮忙。
提前谢谢。
答案 0 :(得分:1)
您应该从click
属性中删除popup-trigger
值。
只试用popover-trigger="'outsideClick'"