如何立即更新角度ui.router嵌套状态？

Question

我试图用angularjs，webpack2做模式弹出。

但是有些问题困扰着我..

我想使具有自定义URL，但

在模式弹出

模式弹出，$state.current仍表示父母的状态。

---

我搜索onEnter函数被调用时状态转换是完全做得到。

和其间，模态的状态不更新。 （我认为这就是为什么模态的状态表示父母的状态）

我可以通过setTimeout函数获得模态自己的状态和stateParams，但它只是欺骗对吗？

如何以正确的方式获得模态的状态？

===

这是我的app.js，

// HOME 
    .state('home', { 
    url: '/', 
    templateUrl: 'client/pages/home/home.html', 
    controller: 'HomeController', 
    }) 

    // PLAYER MODAL 
    .state('player', { 
    url: 'player/:playerName', 
    parent: 'home', 
    onEnter: function($stateParams, $state, $uibModal) { 
     $uibModal.open({ 
     templateUrl: 'client/pages/player/player.html', 
     resolve: {}, 
     controller: 'PlayerController' 
     }).result.then(function (result) { 
     // $scope.$close 
     alert('result ->' + result); 
     }, function (result) { 
     // $scope.$dismiss 
     alert('dismiss ->' + result); 
     }).finally(function() { 
     // handle finally 
     return $state.go('home'); 
     }); 
    } 
    }); 

HomeController中，

angular.module('907degree') 
    .controller('HomeController', function ($scope, $state) { 
    $scope.state = $state.current; 
    $scope.players = ['messi', 'hazard', 'ronaldo']; 

    $scope.showModal = function (playerId) { 
     $state.go('player', { playerName: playerId }); 
    }; 
}) 

和的PlayerController。

angular.module('907degree') 
    .controller('PlayerController', ($scope, $http, $state, $stateParams, itemService) => { 
    $scope.playerState = $state.current; 
    $scope.params = $stateParams.playerName; 
    $scope.item = itemService.get($stateParams.id); 

    $scope.ok = function() { 
     $scope.$close('clicked OK'); 
    }; 

    $scope.dismiss = function() { 
     $scope.$dismiss('clicked CANCEL'); 
    }; 

    $scope.checkState = function() { 
     console.log($state.current, $stateParams); 
     console.log($scope.playerName); 
    } 
    }) 

我认为我的回购比解决这个问题更好，所以就是这样。

混帐克隆hagfish1210@gitlab.com/hagfish1210/907degrees.git & NPM安装& NPM运行开发

Answer 1

注入电流$transition$。

onEnter: function($transition$, $state, $uibModal) { 
    $uibModal.open({ 
    templateUrl: 'client/pages/player/player.html', 
    resolve: { $transition$:() => $transition$ }, 
    controller: 'PlayerController' 
    }).result.then(function (result) { 
    // $scope.$close 
    alert('result ->' + result); 
    }, function (result) { 
    // $scope.$dismiss 
    alert('dismiss ->' + result); 
    }).finally(function() { 
    // handle finally 
    return $state.go('home'); 
    }); 
} 

在的PlayerController要求其参数

angular.module('907degree') 
    .controller('PlayerController', ($scope, $http, $state, $transition$, itemService) => { 
    $scope.playerState = $state.current; 
    var params = $transition$.params(); 
    $scope.params = params.playerName; 
    $scope.item = itemService.get(params.id); 

    $scope.ok = function() { 
     $scope.$close('clicked OK'); 
    }; 

    $scope.dismiss = function() { 
     $scope.$dismiss('clicked CANCEL'); 
    }; 

    $scope.checkState = function() { 
     console.log($state.current, params); 
     console.log($scope.playerName); 
    } 
    }) 

的Transition类公开有关运行过渡多的信息转变：https://ui-router.github.io/ng1/docs/latest/classes/transition.transition-1.html#params