popover实现条件触发

喵先生的进阶之路

要求:nonMandatoryInstrumentCheckList的长度为0的时候,出现提示框。

难点

提示框使用的是popover,由于我们需要按照条件触发这个提示框,所以就要考虑popover的触发方式。但是触发方式只能点击触发鼠标放上触发,跟我们的要求不同。

解决过程

最开始google了一下,但是查到的都只有是bootstrap提供的原始jQuery函数,这是我们不希望使用的。最后找到了项目引用的js文件,是angular-bootstrap,然后找到了他的官方文档,其中可以看到下面的设置项:

clipboard.png

popover-is-open控制提示框是否出现,这正是我们需要的:当满足条件的时候,触发提示框。

最后代码如下:

<a class="btn btn-info btn-sm" popover-placement="top" uib-popover="请点击添加较检器具"  popover-is-open="data.nonMandatoryInstrumentCheckList.length === 0"><i class="fa fa-plus"></i>&nbsp;添加器具</a>

总结

重要的事情说三遍:

多看官方文档!多看官方文档!多看官方文档!
阅读 1.9k

朴世超
个人学习总结与项目实战问题记录
336 声望
20 粉丝
0 条评论
你知道吗?

336 声望
20 粉丝
文章目录
宣传栏