模态在angularJS中关闭后重新加载数据

时间:2016-11-25 06:54:56

标签: javascript html angularjs

- > html代码

<button type="button" class="btn btn-primary" ng-click="platformAppConfigurationCreate()">
  <span class="fa fa-plus"></span>
  <span class="hidden-xs hidden-sm">
    Create
  </span>
</button>

- &GT; Controller.js代码

$scope.platformAppConfigurationCreate = function () {
  $uibModal.open({
templateUrl: 'app/entities/platform-app/platform-app-configuration-dialog.html',
  controller: 'PlatformAppConfigurationDialogController',
  controllerAs: 'vm',
  backdrop: 'static',
  size: 'lg',
  resolve: {
    entity: function () {
      return {
        appConfigUuId: null,
        appConfigName: null,
        appConfigDesc: null,
        appConfigDisplayImageRef: null,
        appConfigExtraInfo: null,
        id: null
      };
    }
  }
});
}

我想在模态弹出窗口关闭后重新加载页面。我该怎么做呢?

3 个答案:

答案 0 :(得分:2)

处理已关闭的事件并在那里执行代码

 $scope.platformAppConfigurationCreate = function() {
            $uibModal.open({
                templateUrl: 'app/entities/platform-app/platform-app-configuration-dialog.html',
                controller: 'PlatformAppConfigurationDialogController',
                controllerAs: 'vm',
                backdrop: 'static',
                size: 'lg',
                resolve: {
                    entity: function () {
                        return {
                            appConfigUuId: null,
                            appConfigName: null,
                            appConfigDesc: null,
                            appConfigDisplayImageRef: null,
                            appConfigExtraInfo: null,
                            id: null
                        };
                    }
                }
            }).closed.then(function(){

             //handle ur close event here
             alert("modal closed")

    }

答案 1 :(得分:0)

我使用ngDialog

ngDialog.open({
    showClose: true,
    template: 'partials/directives/bibliographie/popupAdd.html',
    className: 'ngdialog-theme-default ngdialog-fullscreen',
    scope: $scope,
    closeByDocument: false,
    closeByEscape: true,
    controller: ['$scope', function ($scope) {

    }],
    preCloseCallback: function (value) {
        // called when you close modal
        if (value === 1) {
          ;
            return true;
        }

        return false;
    }
});

对于$ uibModal:

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

答案 2 :(得分:0)

您可以使用以下脚本

$scope.$on('modal.closing', function(event, reason, closed){
     //either reload the state
     $state.reload();   
   //or redirect to a url
    window.location.href="your url";

}