Angular UI Boostrap:如何在没有控制器的情况下关闭模态?

时间:2019-06-14 07:54:13

标签: javascript angularjs angular-ui-bootstrap

我是AngularJS的新手,刚经历了http://angular-ui.github.io/bootstrap/中所述的Angular UI Modal。

我想创建一个只有一个按钮即可关闭模态的简单模态。如何在不为模态创建单独控制器的情况下执行此操作?模式模板中是否有ng-click事件的脚本来完成这项工作?例如this.close() ...

我想要实现的目标如下:

模板:

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

页面控制器:

  $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
    });
  };

1 个答案:

答案 0 :(得分:2)

来自docs

  

与模态内容相关的范围增加了:

     

$ close(result)(类型:函数)-一种可用于关闭   模态,传递结果。

     

$ dismiss(reason)(类型:函数)-一种可用于   消除模态,并传递原因。

     

这些方法可以轻松关闭模式窗口,而无需创建专用控制器。

这可行:

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