[英]Angular UI Boostrap: how to close the modal without a controller?
I'm new to AngularJS, and were just going through Angular UI Modal described in: http://angular-ui.github.io/bootstrap/ . 我是AngularJS的新手,只是通过Angular UI Modal进行了介绍,该描述在http://angular-ui.github.io/bootstrap/中 。
I want to create a simple modal that have just only one button to close the modal. 我想创建一个只有一个按钮即可关闭模态的简单模态。 How to do this without create a separate controller for the modal? 如何在不为模态创建单独控制器的情况下执行此操作? Is there a script for ng-click
event in the modal template to do the job? 模态模板中是否有用于ng-click
事件的脚本来完成这项工作? Such as this.close()
... 如this.close()
...
What I want to achieve look like this: 我要实现的目标如下所示:
Template: 模板:
<div class="modal-header">
<h3>Modal header</h3>
</div>
<div class="modal-body">
<h4>Just something random here</h4>
</div>
<div class="modal-footer">
<button class="btn btn-primary" ng-click="this.close()">OK</button>
</div>
Page controller: 页面控制器:
$scope.openModal = function() {
$uibModal.open({
templateUrl: "modalContent.html",
// it's so simple so that I don't want a separate controller
//controller: "ModalContentCtrl",
size: '',
backdrop: 'static',
keyboard: false
});
};
The scope associated with modal's content is augmented with: 与模式内容相关的范围扩大了:
$close(result) (Type: function) - A method that can be used to close a modal, passing a result. $ close(result)(类型:函数)-一种可用于关闭模式并传递结果的方法。
$dismiss(reason) (Type: function) - A method that can be used to dismiss a modal, passing a reason. $ dismiss(reason)(类型:函数)-一种可用于通过原因而消除模态的方法。
Those methods make it easy to close a modal window without a need to create a dedicated controller. 这些方法可以轻松关闭模态窗口,而无需创建专用控制器。
So this works: 所以这工作:
<div class="modal-header">
<h3>Modal header</h3>
</div>
<div class="modal-body">
<h4>Just something random here</h4>
</div>
<div class="modal-footer">
<button class="btn btn-primary" ng-click="$close()">OK</button>
</div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.