首页 > 编程 > JavaScript > 正文

Bootstrap和Angularjs配合自制弹框的实例代码

2019-11-20 09:09:50
字体:
来源:转载
供稿:网友

指令

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 ==0) {$(elem).modal('hide');return;}if (newValue == 1) {$(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配合自制弹框,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对武林网网站的支持!

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表