Question

我已在父状态中定义了一个params对象，并希望在子状态上为属性赋值，并将该值保留到其他状态。当我导航到子状态时，我看到$ stateParams.property，但是在为$ stateParams.property赋值后，该值不会持续到下一个兄弟状态。

  .state({
    name: 'parent',
    url: '/parent',
    templateUrl: 'app/parent.html',
    controller: 'parentController',
    controllerAs: 'vm',
    resolve: {
      user: function(){
        return { user: {} };
      },
      //regionsCountriesInfo: ['$stateParams', function($stateParams){
      //  return $stateParams.regionsCountriesInfo;
      //}],
      // edit
      regionsCountriesInfo: function(){
        return { value: [] };
      }
    },
    children: [
      {
        name: 'region',
        url: '/region',
        templateUrl: 'app/region.html',
        controller: 'regionController',
        controllerAs: 'vm',
        ncyBreadcrumb: {
          label: 'Regions',
          parent: 'parent'
        },
        resolve: {
          user: function(user) {
            return user;
          },
          // edit
          regionsCountriesInfo: function(regionsCountriesInfo) {
            return regionsCountriesInfo;
          }
        }
      },
      {
        name: 'user',
        url: '/user',
        templateUrl: 'app/user.html',
        controller: 'userController',
        controllerAs: 'vm',
        ncyBreadcrumb: {
          label: 'Users',
          parent: 'parent'
        },
        resolve: {
           user: function(user) {
            return user;
          },
          // edit
          regionsCountriesInfo: function(regionsCountriesInfo) {
            return regionsCountriesInfo;
          }
        }
      },

// regionController
regionController.$inject = [
'$scope',
'$translate',
'$uibModal',
'$state',
'$stateParams',
'$rootScope',
'regionsCountriesInfo'
];

function regionController($scope, $translate, $uibModal, $state, $stateParams, $rootScope, regionsCountriesInfo) {
  ...
  vm.selectedRegions =  [];
  ... 
  vm.selectedRegions.push(region)
  console.log('regionController regionsCountriesInfo');
  console.log(regionsCountriesInfo);
  regionsCountriesInfo = vm.selectedRegions;
  console.log('regionController regionsCountriesInfo');
  console.log(regionsCountriesInfo);

// regionController console output
regionController regionsCountriesInfo
undefined
regionController regionsCountriesInfo
[Object]

// userController
userController.$inject = [
'$translate',
'$uibModal',
'$state',
'$scope',
'$timeout',
'$stateParams',
'$rootScope',
'regionsCountriesInfo'
];
function userController($translate, $uibModal, $state, $scope, $timeout, $stateParams, $rootScope, regionsCountriesInfo) {
  ...
  console.log('userController regionsCountriesInfo');
  console.log(regionsCountriesInfo);

// userController console output
userController regionsCountriesInfo
undefined

为什么$ stateParams.regionsCountriesInfo在区域同级状态下为其分配值时在用户状态中为空？

Answer 1

你需要在父状态下使用resolve，因为$ stateparams只包含在该状态下注册的params。

state({
    name: 'parent',
    url: '/parent',
    templateUrl: 'app/parent.html',
    controller: 'parentController',
    controllerAs: 'vm',
    resolve: {
        regionsCountriesInfo: ['$stateParams', function($stateParams){
            return $stateParams.regionsCountriesInfo;
        }]
    }

Answer 2

我认为每个孩子都会创建孤立的变量，你是否尝试在路由中将其重新传递给孩子？

Answer 3

我想问题是我需要使用常规的解析对象，因为我需要持久保存的值不是以$ stateParams开头，即它是在regionController中定义的。见上面的编辑。

Angular ui路由器持久化$ stateParams

3 个答案: