Question

我正在测试uib-popover并且一切似乎在plunkr中正常工作但是当我将按钮更改为div时，弹出窗口似乎已经移位。

知道为什么吗？

这是从官方plunkr

简化的代码

<div ng-controller="PopoverDemoCtrl">
    <div class="form-group">
      <label>Popover placement</label>
      <select class="form-control" ng-model="placement.selected" ng-options="o as o for o in placement.options"></select>
    </div>
    <div popover-placement="{{placement.selected}}" uib-popover="On the {{placement.selected}}">Popover {{placement.selected}}</div>
</div>

并here is the plunkr来测试它。

谢谢！

Answer 1

div 是块元素，而按钮是内嵌块元素。添加样式：内联块到div，它按预期工作。

<div style="display: inline-block;" popover-placement="{{placement.selected}}" uib-popover="On the {{placement.selected}}">Popover {{placement.selected}}</div>

https://plnkr.co/edit/0UDLTv3ATEtXEjYnJQHF?p=preview

Answer 2

请按以下方式更改您的popover： - 只需在代码中添加class="btn btn-default"，您的弹出窗口就不会替换。 注意： - 仍然需要进行少量的CSS修复。

<div popover-placement="{{placement.selected}}" uib-popover="On the {{placement.selected}}" class="btn btn-default">Popover {{placement.selected}}</div>

uib-popover没有按预期使用DIV元素工作

2 个答案: