ui.bootstrap 弹出框点击关闭 [英] ui.bootstrap popover close on click
问题描述
我有这个带有模板的弹出框
I have this popover with template
<i class="fa fa-link" popover-placement="right" uib-popover-template="'newReferenceTemplate.html'" popover-title="New link"> Add new external reference </i>
因此,当我单击该链接图标时,会打开一个带有此模板的弹出窗口
So when I click on that link icon, a popover opens witht this tamplate
<script type="text/ng-template" id="newReferenceTemplate.html">
<label>Title</label> <br>
<input ng-model="link.Title"> <br>
<label>Url</label> <br>
<input ng-model="link.Url"><br>
<i class="fa fa-floppy-o" > Save </i>
</script>
当我按下那个软盘"图标时,我想关闭弹出窗口.有没有办法做到这一点?
When I press that 'floppy' icon, I'd like to close the popover. Are there any ways of doing this?
我能找到的文档就是popover-is-open
值,但我不知道我是否可以以某种方式使用它,有什么想法吗?
All I can find on documentation is the popover-is-open
value, but I don't know if I can use this somehow, any thoughts?
推荐答案
第 1 步: 将 popover-is-open="isOpen"
添加到触发链接.
Step 1 : Add popover-is-open="isOpen"
to the trigger link.
<i class="fa fa-link add-link"
popover-placement="right"
uib-popover-template="'newReferenceTemplate.html'"
popover-is-open="isOpen"
popover-title="New link"> Add new external reference </i>
第 2 步:当您单击弹出窗口内的软盘图标时,将 isOpen
设置为 false:
Step 2 : When you click the floppy icon inside the popover, set isOpen
to false:
这是弹出框的保存图标:
This is the save icon of the popover:
<i class="fa fa-floppy-o" ng-click="save()"> Save </i>
这是在控制器中:
$scope.save = function () {
$scope.isOpen = false;
};
参见plunker
See plunker
这篇关于ui.bootstrap 弹出框点击关闭的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!