Обнаружить закрытие $mdDialog при нажатии ESC

У меня есть $mdDialog с полями ввода. Перед закрытием $mdDialog содержимое полей ввода сохраняется. Итак, когда пользователь нажимает кнопку «закрыть», вызывается функция для выполнения некоторой операции с данными и их сохранения. Однако я не смог обнаружить закрытие $mdDialog по ESC. Можно ли обнаружить событие закрытия с помощью ESC в контроллере $mdDialog?

Вот пример кода. ссылка Codepen

angular.module('MyApp', ['ngMaterial'])

.controller('AppCtrl', function($scope, $mdDialog, $rootScope) {
  //$rootScope is used only of this demo
  $rootScope.draft = '  ';

  $scope.showDialog = function(ev) {
    var msgDialog = $mdDialog.show({
      controller: 'DemoDialogCtrl',
      template: "<md-input-container><label>Text</label><input type='text' ng-model='myText' placeholder='Write text here.'></md-input-container><md-button ng-click='close()'>Close</md-button>",
    })

  };


});

(function() {
  angular
    .module('MyApp')
    .controller('DemoDialogCtrl', DemoDialogCtrl);

  DemoDialogCtrl.$inject = ['$scope', '$rootScope', '$mdDialog'];

  function DemoDialogCtrl($scope, $rootScope, $mdDialog) {


    $scope.close = function() {
      //$rootScope is used only of this demo
      // In real code, there are some other operations 
      $rootScope.draft = $scope.myText;

      $mdDialog.hide();
    }

  }
})();
<div ng-controller="AppCtrl" class="md-padding dialogdemoBasicUsage" id="popupContainer" ng-cloak="" ng-app="MyApp">
  <div class="dialog-demo-content" layout="row" layout-wrap="" layout-margin="" layout-align="center">
    <md-button class="md-primary md-raised" ng-click="showDialog($event)">
      Open Dialog
    </md-button>
    <div id="status">
      <p>(Text written in $mdDialog text field must appear here when user closes the $mddialog. User can press close button or press ESC button.
      </p>
      <b layout="row" layout-align="center center" class="md-padding">
                 Draft: {{draft}}
            </b>
    </div>
  </div>
</div>


angularjs angularjs-material
person van    schedule 06.09.2016    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Вы должны использовать обещание API.

$mdDialog.show().finally(
   function onModalClose(){

   }
);

Но приемник с внешним кодом следует использовать с другим механизмом, например, предоставляя область действия.

var modalScope = $rootScope.$new(true);
$mdDialog.show({scope: modalScope}).finally(function(){
    $rootScope.draft = modalScope.myText;
});
person Valery Kozlov    schedule 07.09.2016
comment
Разве это не может быть обработано в контроллере самого $mdDialog? Я бы предпочел не возлагать ответственность на место, где инициируется $mdDialog + мне нужны функции от контроллера - person Thomas Stubbe; 28.09.2016
comment
вы можете указать область действия для модального окна и попытаться прослушать destroy - scope.$on('$destroy') - person Valery Kozlov; 28.09.2016