ui.bootstrap popover-is-open doesn't work properly

Question

I want not to show ui.bootstrap popover by using popover-is-open directive. For example, in template:

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

And in controller:

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

See plunkr

I am expecting that popover should never be opened, but it opens on click on it. It seems that popover-is-open affects only first angular compiling. Any ideas?

upd: Actually, i want not to show popover only in some cases, in other cases it should be shown. For example, i have download-dialog popover and i want to show it only if size of file is greater than some limit.

Answer 1

The popover-is-open is only for the initial behavior, i.e. if it evaulates to true, then the popover opens instantly even without a click. If you change the value of isOpen to true in your plunkr, you see that (my example plunkr).

What you want is the popover-enable attribute:

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

Update for the question update:

You are free to evaluate any boolean expression in the popover-enable attribute instead of the static isOpen which always evaulates to false in your example.

I have created an advanced plunkr to show that:

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

with the controller code

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

You have a new text box where you can enter a number to simulate the download size. When it gets > 100, the popup will be enabled.

Answer 2

In order to handle the open state whit the popover-is-open value you must set popover-trigger="none" or maybe popover-trigger="'none'". As it says in the docs

Using the 'none' trigger will disable the internal trigger(s), one can then use the popover-is-open attribute exclusively to show and hide the popover.

Answer 3

Use

 $scope.$apply(function () {

$scope.isOpen = false;     

});

method for applying this property