如何在 Angular JS 的弹出框之外单击时隐藏 uib-popover？答案

【问题标题】：How to hide uib-popover on click outside of the popover in angular JS?如何在 Angular JS 的弹出框之外单击时隐藏 uib-popover？
【发布时间】：2021-01-11 19:18:45
【问题描述】：

<button class="btn btn-default blue btn-lg h-ask btn-block" popover-placement="bottom" uib-popover-template="popover_home.templateUrl">ASK</button>

上面是angular js popover的代码，在popover的html模板中也有两个输入框，所以当用户在popover里面提交html表单时，我可以控制popover，但是需要手动关闭用户打开此弹出框并且不对弹出框执行任何操作（例如：单击弹出框外部）。

对此有任何想法吗？我使用了“popover-trigger='focus'”，但它不允许我写入输入字段（只要悬停弹出框就会关闭）

【问题讨论】：

可能重复，解决方案是here 与工作plunkr

标签： javascript angularjs

【解决方案1】：

不知道您使用的是哪个版本的 angular-ui boostrap，但我使用的是最新的 (1.1.1) 并添加此功能：

popover-trigger="outsideClick"

您可以在此演示中看到。

popover close when click outside

希望对你有帮助！

【讨论】：

我不知道为什么，但这对我不起作用（我已经检查过版本），但 popover-trigger="'outsideClick'" 有效...
在 2.x.x 版本中，必须使用 popover-trigger="'outsideClick'" （注意双引号内的单引号）

【解决方案2】：

对于那些不阅读 cmets 的人 :-) 基于@kuanyui 评论，如果它不能与接受的答案一起工作，请尝试添加简单的 cotes '

popover-trigger=" 'outsideClick' "

【讨论】：