Как подключить "OnOpen" слушатель для UIB-поповера?

Контекст: я использую угловой 1 и этот элемент управления UIB Popover.

Поскольку в шаблоне всплывающего окна есть текстовое поле, которое я вызвал, моя цель - фокусироваться на этом текстовом поле при каждом открытии всплывающего окна.

К сожалению, для "onOpen" нет прослушивателя / события popover.

Поэтому я попытался сделать

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
})

Мне просто интересно, какие еще варианты у меня могут быть?

Спасибо

1 ответ

Я ничего не нашел в документации, в которой говорилось о событиях, и обнаружил эту проблему на github ui-bootstrap, заявив, что они не поддерживают события и никогда не планируют их реализовывать. https://github.com/angular-ui/bootstrap/issues/5060

Если вы ищете другой вариант, который предоставил бы вам доступ к событиям, можно было бы реализовать собственную директиву popover, которая просто оборачивает загрузочные всплывающие окна. Теоретически, они могут функционировать так же, как ui-bootstrap, и позволяют напрямую подключаться к событиям, предоставляемым 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();
                }
            });
        }
    };
}

Подобно uib-popover, вы можете добавить поддержку дополнительных конфигураций, добавив дополнительные свойства области видимости.

Другие вопросы по тегам