隐藏Angular Bootstrap模态而不是关闭

Hide Angular Bootstrap modal instead of close

本文关键字：Angular Bootstrap 模态 隐藏      更新时间：2023-09-26

我正在使用Angular Bootstrap Modal打开一堆模式，包括内的视频播放器

http://angular-ui.github.io/bootstrap/#/modal

我希望即使模态关闭，也能保持视频的位置。只是下次我再次打开同一个模态时，我可以看到我在视频中停止的地方。

为了做到这一点，我需要做：

  1. 创建每个模态一个单独的实例

  2. 我需要隐藏（）模态，而不是关闭（）。因此，DOMs仍然在那里，视频播放器不会重新创建

有什么优雅的方式可以做到这一点，因为引导模式没有隐藏功能。我应该只使用jQuery来显示/隐藏.modal-backdrop和.modal类吗？

From关闭时不要破坏角度引导模式：

为什么不把模态状态抽象成它自己的服务呢？这样，无论何时创建模态控制器，它都会使用服务在初始化时设置视图状态。

例如。创建服务

.factory('ModalStateService', function(){
    var state = {
        someValue: 'something'
    };
    return {
        getState: function() { return state; }
    };
});

然后在您的控制器中：

.controller('ModalCtrl', function($scope, ModalStateService){
    $scope.viewState = ModalStateService.getState();
});

然后在模式内容视图中，例如：

 <span>{{viewState.someValue}}</span>

如果您在模态中设置someValue，例如通过输入，服务状态将被更新。然后，当您创建和销毁模态时，该状态将持续存在。

相关文章：