Angular UI Bootstrap：如何在没有控制器的情况下关闭模式？答案

【问题标题】：Angular UI Boostrap: how to close the modal without a controller?Angular UI Bootstrap：如何在没有控制器的情况下关闭模式？
【发布时间】：2019-10-28 20:00:24
【问题描述】：

我是 AngularJS 的新手，刚刚经历了 Angular UI 模态，描述于：http://angular-ui.github.io/bootstrap/。

我想创建一个简单的模式，只有一个按钮来关闭模式。如何在不为模态创建单独的控制器的情况下做到这一点？模态模板中是否有 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
    });
  };

【问题讨论】：

controller 也可以是函数

标签： javascript angularjs angular-ui-bootstrap

【解决方案1】：

来自docs：

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

$close(result) (Type: function) - 一种可以用来关闭一个模态的，传递一个结果。

$dismiss(reason) (Type: function) - 一种可用于关闭一个模态，传递一个原因。

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

所以这行得通：

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

【讨论】：