指令
directive('bsPopup', function ($parse) {
return {
require: 'ngModel',
restrict: 'A',
link: function (scope, elem, attrs, ctrl) {
scope.$watch(function () {
return $parse(ctrl.$modelValue)(scope);
}, function (newValue) {
if (newValue ==) {
$(elem).modal('hide');
return;
}
if (newValue == ) {
$(elem).modal('show');
return;
}
});
}
}
});
 <button class="btn btn-xs btn-warning" data-target="#myModal" data-toggle="modal" ng-click="sss()">弹框</button>
<div aria-hidden="true" aria-labelledby="myModalLabel" role="dialog" tabindex="-1" class="modal fade" bs-popup="" ng-model="test"
id="myModal" style="display: none;">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header alert-info">
<button aria-hidden="true" data-dismiss="modal" class="close" type="button">×</button>
<h4 id="myModalLabel" class="modal-title">弹框</h4>
</div>
<div class="modal-body">
<button class="btn btn-info" ng-click="hhh()">测试</button>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>

Bootstrap+Angularjs自制弹框的更多相关文章

  1. 自己写的基于bootstrap风格的弹框插件

    自己写的一款基于bootstrap风格的弹框插件,暂时只有确认框.提示框.后续功能扩展.bug修改再更新. ;(function($){ //默认参数 var PARAMS; var DEFAULTP ...

  2. angularjs指令弹框点击空白处隐藏及常规方法

    效果图展示: 第一种方法:angularjs自定义指令: 指令: app.directive('onBlankHide', function () { return { restrict: 'A', ...

  3. 参考bootstrap中的popover.js的css画消息弹框

    前段时间小颖的大学同学给小颖发了一张截图,图片类似下面这张图: 小颖当时大概的给她说了下,其实小颖也不知道上面那个三角形怎么画嘻嘻,给她说了DOM结构,具体的css让她自己百度,今天小颖自己参考boo ...

  4. bootstrap弹框

    http://v3.bootcss.com/javascript/#modals 参考bootstrap官网 模态框做php后端 前端一直不行,但是很多时候 用到ajax都要用到弹框,一直在代码里面找 ...

  5. Bootstrap学习笔记(9)--模态框(登录/注册弹框)

    说明: 1. 上来一个ul先把登录和注册两个链接扔进去,ul的类nav,navbar-nav是导航条,navbar-right让他固定在右侧.每个li的里面,data-toggle="mod ...

  6. angularJs $mdDialog和$uibModal弹框关闭传值

    $mdDialog以一个点击button按钮出现弹框为例: $scope.btn=function($event,row){ var dScope = $scope.$new(true); dScop ...

  7. bootstrap + angularjs + seajs构建Web Form前端(1)

    bootstrap + angularjs + seajs构建Web Form前端(一) 简介 Bootstrap是Twitter推出的一个用于前端开发的开源工具包,它由Twitter的设计师Mark ...

  8. js弹框3秒后自动消失

    开发中有时候会需要最出弹框后,过几秒自动消失的效果,下面给大家分享一下我自己做的一个小案例. 案例中的弹框使用的是bootstrap里面的模态框,实现自动消失则用的是js中的setInterval方法 ...

  9. Bootstrap Modals(模态框)

    http://www.runoob.com/bootstrap/bootstrap-v2-modal-plugin.html 描述 Bootstrap Modals(模态框)是使用定制的 Jquery ...

随机推荐

  1. ASP.NET 5 RC 1:UrlRouting 设置(不包含MVC6的UrlRouting设置)

    转自:http://habrahabr.ru/company/microsoft/blog/268037/?mobile=no 1.project.json { "version" ...

  2. NSAttributedString 上下标---!!!!!

    下面这段,亲试可用 /*将符号转换为上标*/ -(NSMutableAttributedString *)changeToSuperscriptForNumberSignWith:(NSString ...

  3. 【C语言】为什么指明数组的列数?

    首先,我们拿二维数组为例.二维数组称为矩阵.二维数组在概念上是二维的,但实际的硬件存储器却是连续编址的,也就是说存储器单元是按一维线性排列的.如果将二维数组作为参数传递给函数,那么在函数的参数声明中必 ...

  4. thinkphp日志分析

    #!/usr/bin/perl -w use strict; use warnings; use Tie::File; #### # Thinkphp日志分析 # 日志基本格式:{$now} &quo ...

  5. Access2007 操作或事件已被禁用模式阻止解决办法

    在“消息栏”上,单击“选项”. 在“Microsoft Office 安全选项”对话框中,单击“启用此内容”,然后单击“确定”. 如果没有看到消息栏在“数据库工具”选项卡上的“显示/隐藏”组中,单击“ ...

  6. Canvas文本操作

    Canvas的画图环境提供三个方法如:绘制填充文本:fillText();绘制描边文本:strokeText();绘制文本并返回一个对象:measure();measure()方法返回的对象中包括一个 ...

  7. samba 服务器搭建

    为了能在两台机器上共享代码,方便测试不同平台性能和搭建分布式的web server,今天耗费半天时间搭建一个samba服务器共享数据,要求开放写权限,但多次实验均告失败,最终在 鸟哥 的提醒下 检查发 ...

  8. MFC中无标题栏窗口的移动

    原文链接: http://blog.sina.com.cn/s/blog_6288219501015dwa.html   移动标准窗口是通过用鼠标单击窗口标题条来实现的,但对于没有标题条的窗口,就需要 ...

  9. asp.net页面之间传值方法详解

    asp.net中页面之间传值我们用得最多的就是get,post这两种了,其它的如session,appliction,cookie等这些相对来说少用也不是常用的,只是在特殊情况下在使用了. 1. Ge ...

  10. 【转载】使用 Google Guava 美化你的 Java 代码

    转载地址: https://blog.csdn.net/wisgood/article/details/13297535 原文地址:https://my.oschina.net/leejun2005/ ...