How to hook to "OnOpen" listener for uib-popover?

Question

Context: I am using angular 1 and this UIB Popover control.

Since there is a text field in the popover template I called, my target is to focus on that text field whenever the popover is opened.

Unfortunately, there is no popover listener/event for "onOpen".

So I tried to do a

scope.$watch(()=>{return scope.isOpen}, (obj) ={
  // where scope.isOpen is the local var in the popover-is-open
  // expecting to write some code here to manipulate the element
  // to realise the focus operation
  // but there is no popover element yet when this is called
})

I was just wondering what other options I might have?

Thanks

Answer 1

I found nothing on the documentation talked about events and found this issue on the ui-bootstrap github stating that they do not support events nor do they ever plan to implement them. https://github.com/angular-ui/bootstrap/issues/5060

If you're looking for a different option that would give you access to the events would be to implement your own popover directive that simply wraps bootstrap popovers. In theory, they can function the same as the ui-bootstrap and allows you to tap directly into the events provided by bootstrap.

HTML

<div my-popover="Hello World" popover-title="Title" popover-shown="myCallback()">...</div>

JavaScript ('my-popover.directive.js')

angular
    .module('myModule')
    .directive('myPopover', myPopover);

function myPopover() {
    return {
        scope: {
            popoverTitle: '@',
            popoverShown: '&'
        },
        restrict: 'A',
        link: function(scope, elem, attr) {
            $(elem).popover({
                title: scope.popoverTitle,
                content: attr.myPopover
            });

            $(elem).on('shown.bs.popover', function () {
                if(scope.popoverShown && typeof scope.popoverShown === 'function'){
                    scope.popoverShown();
                }
            });
        }
    };
}

Similar to uib-popover, you can add support for additional configurations by adding additional scoped properties.