Bootstrap- angular -ui модальный при загрузке

Я использую bootstrap- angular -ui-modal для сайта, над которым я работаю. Код, который я использую, чтобы открыть модальный

$modal.open(
    {
        templateUrl: '/home/template',
        controller: myCtrl,
        resolve: {
            data: function () {
                return data;
            }
        }
    });

Все работает нормально. Но мне нужно найти способ выполнить некоторый код после загрузки модала. Я пробовал разные вещи, но не могу заставить их работать. Некоторые из вещей, которые я пробовал

В шаблоне я сделал

<script>
    document.onload = function () {
        console.log('opened');
    };
</script>

Я также обнаружил, что существует обещание для модального объекта angular с именем openned. Я попытался

modalInstance.opened.then(function(){console.log('hello')});

тоже не работает. Здесь я могу помочь.

Ответ 1

Это определенно не очень хорошее решение, но по крайней мере сработало для меня. Я просто добавил таймаут перед выполнением желаемой функции,

modalInstance.opened.then(
    $timeout(function() {
            console.log('hello');
        }, delay));

Ответ 2

UI-bootstraps modal имеет решение result.

"открыт" - обещание, которое разрешается, когда модаль открывается после загрузка шаблона контента и разрешение всех переменных

или

Используйте ng-init. Создайте div внутри вашего файла шаблона:

<div ng-init="func()"></div>

Ответ 3

Начиная с версии 0.13.0 существует rendered обещание, которое вы можете использовать.

rendered (Тип: promise) - разрешается при рендеринге модальности.

Пример:

this.modalInstance.rendered.then(function () {
    console.log("modal is rendered");
});

Ответ 4

Если вы хотите что-то сделать после загрузки DOM, лучше всего делать такую вещь внутри директивы. См. Здесь: http://docs.angularjs.org/guide/directive#creating-a-directive-that-manipulates-the-dom

Вы можете пометить свое модальное тело (или что-то внутри модального) своим атрибутом директивы, а затем создать директиву так:

App.directive('myDirective', function($timeout) {
        function link(scope, element, attrs) {
            $timeout(function () {
                // stuff to do after DOM load here
            });
        }

        return {
             link: link
        };
    });