AngularJS - 可以 ng-show/ng-hide 模态窗口吗? [英] AngularJS - Possible to ng-show/ng-hide a modal window?

查看:24
本文介绍了AngularJS - 可以 ng-show/ng-hide 模态窗口吗?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

谢谢.

解决方案

看这个例子:

<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">启动演示模式<div class="modal淡入" aria-hidden="false" style="display: block;"ng-show="showModal"><div class="modal-dialog"><div class="modal-content">莫代尔<div class="modal-footer"><button type="button" class="btn btn-primary" ng-click="showModal=false">好的</button>

I want to keep the state of my bootstrap.ui (OR ngdialog!!) modal window when it is closed. Any idea how I might ng-show/ng-hide a modal window?

Thanks.

解决方案

Look this example:

<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>

这篇关于AngularJS - 可以 ng-show/ng-hide 模态窗口吗?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
前端开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆