Angular UI Boostrap: как закрыть модал без контроллера? - PullRequest
Новая
       13

Angular UI Boostrap: как закрыть модал без контроллера?

0 голосов
/ 14 июня 2019

Я новичок в AngularJS, и только что прошел через Angular UI Modal, описанный в: 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
    });
  };

1 Ответ

2 голосов
/ 14 июня 2019

Из документов :

Область действия, связанная с содержимым модала, дополнена:

$ close (result) (Type: function) - Метод, который можно использовать для закрытия модальный, передавая результат.

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