10

Angularで Bootstrap UI ( https://angular-ui.github.io/bootstrap/ ) のモーダル コンポーネントを使用してモーダルをレンダリングしていますが、閉じるときに別の状態にリダイレクトできるようにしたい、または少なくとも関数を呼び出す必要があります。

問題は、イベントをインターセプトできることですが、closeユーザーがモーダルを押すたびに閉じられ、イベントをキャッチしたり、返されたプロミスに関数を割り当てEscたりするドキュメントが見つかりませんでした。dismiss

コードは次のとおりです。

var modalInstance = $uibModal.open({
  templateUrl: 'a-template.html',
  controller: 'AnotherCtrl',
  controllerAs: 'modal',
  backdrop: false,
  size: 'lg'
});

// I am able to catch this whenever the user exits the modal in an
// orthodox fashion. Doesn't happen when he presses Esc button.
modalInstance.closed = function () {
  $state.go(homeState); 
};

あるいは、私のビジネスケースに適した別の解決策は、ユーザーがモーダルを閉じることを単に許可しないことです。モーダルコントローラーでイベントが発生するたびに、自分で閉じます。これまでのところ、これに対する機能は見つかりませんでした。

4

1 に答える 1

23

$scope.$on()モーダルに関連付けられたコントローラー（「AnotherCtrl」または「modal」）では、'modal.closing'イベントで使用できます。

例：

var modalInstance = $uibModal.open({
  templateUrl: 'a-template.html',
  controller: ['$scope', function($scope){
    $scope.$on('modal.closing', function(event, reason, closed){
        if('condition for not closing')
            event.preventDefault(); //You can use this to prevent the modal from closing            
        else
            window.location = "https://www.youtube.com/watch?v=dQw4w9WgXcQ";            
    });
  }],
  controllerAs: 'modal',
  backdrop: false,
  size: 'lg'
});
于 2016-03-17T16:48:23.343 に答える