Как открыть модальный внутри модального с правильным фоном с угловым основанием?

angular-foundation не поддерживает модальность внутри другой модальности. Значения z-индекса жестко запрограммированы.

Есть решение, заменяющее модальное окно, но оно нам не подошло. http://foundation.zurb.com/docs/components/reveal.html

Я реализовал директиву для этого (машинопись) -

export function ModalPositionHelper($modalStack):ng.IDirective {
    var initialModalZIndex = 1005;
    return {
        restrict: 'A',
        link: function (scope) {
            scope.$watch(function () {
                return $modalStack.getTop();
            }, function (newModal, oldModal) {
                if (oldModal) {
                    oldModal.value.modalDomEl.css('z-index', initialModalZIndex);
                }
                if (newModal) {
                    newModal.value.modalDomEl.css('z-index', initialModalZIndex + 2);
                    angular.element('.reveal-modal-bg').css('z-index', initialModalZIndex + 1);
                }
            });
        }
    };
}

В основном я смотрю $modalStack.getTop() и меняю его z-индекс.

Из этого не может получиться хорошего пользовательского опыта. Пересмотр вашего подхода был бы лучше, чем двойной модальный. Некоторые исправления не связаны с кодом.