Question

我有一个非常简单的模态对话框，从主标题栏显示。当我关闭模态对话框时，它不会返回到原始页面。地址栏中显示的网址是我关闭的模式。如何返回单击按钮时显示的原始页面。这是我的代码：这是app.js，这就是Modal， reportSettingModal 的显示方式。

.config(function ($stateProvider, $urlRouterProvider) {
    $stateProvider
      .state('login', {
        url: '/login',
        templateUrl: 'lib/views/login.html',
        controller: 'LoginCtrl'
      })
      .state('home', {
        url: '/home',
        templateUrl: 'views/home.html',
        controller: 'HomeCtrl'
      })
      .state('renderReport',{
        url: '/renderReport/{guid}',
        templateUrl: 'views/renderReport.html',
        controller: 'RenderReportCtrl'
      })

      .state('vAnalyze',{
        url: '/vAnalyze',
        templateUrl: 'views/vAnalyze.html',
        controller: 'VAnalyzeCtrl'
      })
       .state('reportSetting',{
        url: '/reportSettingModal',
        onEnter: function($modal){
          $modal.open({
              templateUrl: 'views/reportSettingModal.html',
               controller: 'ReportSettingModalCtrl'
          });
        }
      });

这是HTML：

<div class="modal-header" id="reportSettingModal" style="background-color: #A33441; color: white;">
    <h4 class="modal-title">{{title}}</h4>
</div>
<div class="modal-body">
    <button type="button" class="btn btn-danger" style="margin-right: 5px; margin-left: 5px;" ng-click="updateWarehouse()">Update Warehouse</button>
</div>  
<div class="modal-footer">
    <button class="btn btn-sm btn-vow" id="closeButton" ng-click="close()">Close</button>
  </div>

这是控制器：

angular.module('vAnalyzeApp.controllers')
.controller('ReportSettingModalCtrl', [
    '$scope',
    '$uibModal',
    'Session',
     '$uibModalInstance',
    function($scope, $uibModal, session,  $uibModalInstance){
            $scope.username = session.user;
            $scope.title = 'Report Settings';

    $scope.close = function() {
      $uibModalInstance.close();
    };
  } //end main function
]);

所以，如果我在VAnalyze页面上打开模态，当我关闭模态时，我想要在VAnalyze页面上。

更新

.run(['AuthService', 'configSettings', '$rootScope',
    function (AuthService, configSettings, $rootScope) {

      // Apply Product Code
      configSettings.productCode = 'VANALYZE';
      AuthService.configProduct(configSettings.productCode);
    },
    function ($rootScope) {
       $rootScope.$on('$stateChangeSuccess', function(event, to, toParams, from, fromParams) {
        $rootScope.$previousState = from;
      });
    }

  ]);

更新我将state.go函数添加到模态关闭函数，但在打开模态时仍未返回上一个url。这是我目前的近距离功能：

$scope.close = function() {
      $uibModalInstance.close();
      $state.go($rootScope.$previousState.name, {
        url: $rootScope.$previousState.url,
        templateUrl: $rootScope.$previousState.templateUrl,
        controller: $rootScope.$previousState.controller
      });
    };

通过代码逐步执行url，名称templateUrl和控制器都已正确设置。

Answer 1

要返回上一个状态，您需要存储它，以便您可以在模态关闭时重新路由到它。

您需要在app.js文件中添加此功能，方法与定义config相同，

.run(['AuthService', 'configSettings', '$rootScope', function (AuthService, configSettings, $rootScope) 
  { // Apply Product Code 
    configSettings.productCode = 'VANALYZE';
    AuthService.configProduct(configSettings.productCode); 
    $rootScope.$on('$stateChangeSuccess', function(event, to, toParams, from,      fromParams) {
        $rootScope.$previousState = from;
    });
  } ]);

在ReportSettingModalCtrl内，

angular.module('vAnalyzeApp.controllers')
.controller('ReportSettingModalCtrl', [
'$scope',
'$uibModal',
'Session',
 '$uibModalInstance',
 '$state',
 '$rootScope' 
function($scope, $uibModal, session,  $uibModalInstance, $state, $rootScope){
        $scope.username = session.user;
        $scope.title = 'Report Settings';

$scope.close = function() {
  $uibModalInstance.close();
  $state.go($rootScope.$previousState.name);
   };
  } //end main function
]);

Answer 2

选项1：

在关闭功能中，您应指定要进入的状态。一旦用户关闭模态。

$scope.close = function() {
   $uibModalInstance.close();
   $state.go('state-name');
};

选项2：

如果URL不相关，您可以从VAnalyze状态控制器调用Modal服务，该控制器是VAnalyzeCtrl：

$modal.open({
    templateUrl: 'views/reportSettingModal.html',
    controller: 'ReportSettingModalCtrl'
});

通过这样做，您不必将用户重定向到以前的URL。

关闭模态对话框不会返回到原始html页面

2 个答案: