【问题标题】:AngularJS - Possible to ng-show/ng-hide a modal window?AngularJS - 可以 ng-show/ng-hide 模式窗口吗?
【发布时间】:2016-02-05 03:42:29
【问题描述】:

我想在 bootstrap.ui(或 ngdialog !!)模式窗口关闭时保持其状态。知道如何 ng-show/ng-hide 模态窗口吗?

谢谢。

【问题讨论】:

  • 不,bootstrap.ui 模式不存在“显示”选项。我不知道那个人在说什么。 docs - angular-ui.github.io/bootstrap - 我真的希望有人会否决他并添加评论,我不能因为我没有足够的代表。
  • 好吧,您总是可以使用纯 css 的显示或可见性...
  • 是的,我想到了,只是希望有另一种方法!谢谢。
  • 您可以将隐藏或显示类添加到 .modal-dialog 级别并进行切换

标签: javascript html angularjs angular-ui-bootstrap


【解决方案1】:

看这个例子:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<link rel="stylesheet" type="text/css" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css">
<div ng-app>
    <div ng-init="showModal=false">
        <button class="btn btn-primary btn-lg" ng-click="showModal = !showModal">
            Launch demo modal
        </button>
        <div class="modal fade in" aria-hidden="false" style="display: block;" ng-show="showModal">  
            <div class="modal-dialog">    
                <div class="modal-content">   
                    MODAL   
                    <div class="modal-footer">        
                        <button type="button" class="btn btn-primary" ng-click="showModal=false">Ok</button>     
                    </div>    
                </div>  
            </div>
        </div>
    </div>
</div>

【讨论】:

  • 将模态 HTML 放在与您的主页相同的 HTML 中是一种好习惯吗?我的模式也有一个控制器,所以 ng-model 必须通过我的服务共享。由于这种结构,我有一个专门用于我的模态的 HTML 文件,所以我的问题是 - 我如何 ng-show/ng-hide 整个模板?
  • 如果模态很简单,可以在代码主中。这个模态被其他组件使用了?
  • 感谢您的帮助,这很好用。它不像我想要的那样活泼,但它是我设法开始工作的唯一解决方案!
猜你喜欢
  • 2014-12-08
  • 2014-03-27
  • 2015-01-30
  • 2015-07-22
  • 2015-06-29
  • 1970-01-01
  • 1970-01-01
  • 2017-10-19
  • 1970-01-01
相关资源
最近更新 更多