angularjs - ui.bootstrap popover-is-open 无法正常工作

Question

我不想使用 popover-is-open 指令显示 ui.bootstrap popover。例如，在模板中:

  <button class="fa fa-link add-link" 
    uib-popover="popover" 
    popover-is-open="isOpen"> Show popover </i>

在 Controller 中:

angular.module('demoModule').controller('PopoverDemoCtrl', function ($scope) {
  $scope.isOpen = false;      
});

见 plunkr

我希望 popover 永远不会被打开，但它会在点击它时打开。似乎 popover-is-open 只影响第一个 Angular 编译。有任何想法吗？

更新:实际上，我只想在某些情况下不显示 popover，在其他情况下应该显示它。例如，我有下载对话框弹出窗口，我只想在文件大小大于某个限制时显示它。

Answer 1

popover-is-open仅适用于初始行为，即如果它评估为 true ，然后弹出窗口即使没有点击也会立即打开。如果更改 isOpen 的值至 true在您的 plunkr 中，您会看到 ( my example plunkr )。

您要的是popover-enable属性:

<button class="fa fa-link add-link" 
 uib-popover="popover" 
 popover-enable="isOpen">Show popover</button>

问题更新的更新:

您可以自由地计算 popover-enable 中的任何 bool 表达式。属性而不是静态 isOpen总是评估为 false在你的例子中。

我创建了一个 advanced plunkr表明:

<input type="text" ng-model="downloadSize">
<button class="fa fa-link add-link" 
 uib-popover="popover" 
 popover-enable="isOpen()">Show popover</button>

与 Controller 代码

$scope.isOpen = function() { return $scope.downloadSize > 100; }

您有一个新的文本框，您可以在其中输入一个数字来模拟下载大小。当它得到时 > 100 ，弹出窗口将被启用。