Angular Bootstrap Modal让背景打开

Question

我正在使用AngularUI在我的Angular 1.4应用程序中集成Bootstrap组件,例如Modals.

我在我的控制器中调用一个模态,如下所示:

var modalInstance = $modal.open({
  animation: true,
  templateUrl: '/static/templates/support-report-modal.html',
  controller: 'ModalInstanceCtrl'
});

不幸的是,当我想通过使用以下方式关闭Modal时:

modalInstance.close();

模态本身消失了,背景也逐渐消失,但它没有从DOM中删除,因此它覆盖了整个页面,使页面无响应.

当我检查时,我看到了这个:

在https://angular-ui.github.io/bootstrap/#/modal上的文档中的示例中,modal-open将从正文中删除该类,并modal-backdrop在关闭时从DOM中删除整个类.为什么模态逐渐消失,但在我的示例中没有从DOM中删除背景？

我已经检查了许多关于bootstrap Modals背景的其他问题,但我似乎无法弄清楚出了什么问题.

Answer 1

这显然是由于一个错误.AngularUI尚不支持Angular 1.4.一旦http://github.com/angular-ui/bootstrap/issues/3620得到解决,这将有效.

Answer 2

直到团队得到这个排序是一个解决方案.

<div class="modal-footer">
    <button class="btn btn-primary"
        ng-click="registerModal.ok()"
        remove-modal>OK</button>
    <button class="btn btn-warning"
        ng-click="registerModal.cancel()"
        remove-modal>Cancel</button>
</div>

/*global angular */
(function () {
'use strict';
angular.module('CorvetteClub.removemodal.directive', [])
.directive('removeModal', ['$document', function ($document) {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            element.bind('click', function () {
                $document[0].body.classList.remove('modal-open');
                    angular.element($document[0].getElementsByClassName('modal-backdrop')).remove();
                    angular.element($document[0].getElementsByClassName('modal')).remove();
                });
            }
        };
    }]);
}());

不幸的是,该团队似乎没有关于这个问题的同一页面,因为它被贡献者推送到一个单独的线程,然后被推送到的线程被另一个人关闭,因为它被另一个人视为"非主题".