Как подключить «OnOpen» слушатель для UIB-поповера? - PullRequest
Новая
       20

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

0 голосов
/ 12 февраля 2019

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

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

enter image description here

К сожалению, для "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 Ответ

0 голосов
/ 12 февраля 2019

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

Если вы ищете другой вариант, который предоставил бы вам доступ к событиям, можно было бы реализовать собственную директиву popover, которая просто переносит загрузочные всплывающие окна.Теоретически они могут функционировать так же, как и пользовательский интерфейс начальной загрузки, и позволяют напрямую подключаться к событиям, предоставляемым загрузчиком.

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, вы можете добавить поддержку дополнительных конфигураций, добавив дополнительные свойства области.

...