Question

问题：出于某种原因，我无法让我的控制器识别跨会话的网址参数。

背景：我有一个名为modal的嵌套视图，它带有一个参数，其网址为 / modal /：id （例如：/＃/ modal / 1 /或/＃/楼层平面图/ 1 + 2 /）。理想情况下，当用户转到此URL时，模式将自动打开具有给定ID的资源。

由于父状态和子状态（模态）由同一个控制器处理，因此模态状态的配置中的自定义数据属性（modalStatus）设置为true。启用此自定义属性后，将显示模式。

我现在可以从父状态转到嵌套状态并触发模式但是当我启动一个新会话或用像/ modal / 3这样的url刷新页面时，应用程序无法读取参数（$ stateParams），它被记录为空对象。

我尝试过使用onEnter和Resolve，但我并不清楚如何在这种情况下使用它们。

路由器

$stateProvider
  .state('home', {
    name: 'home',
    url: '/',
    templateUrl: 'views/main.html',
    controller: 'MainCtrl'
  })
  .state('home.modal', {
    url: 'modal/:id/',
    data: {
      modalState: true
    },
    controller: 'MainCtrl'
  })

控制器的相关部分：

$scope.init = function() {
  console.log($stateParams);
  if ($state.current.data) {
    if ($state.current.data.modalState === true) {
      $scope.openModal();
    }
  }
};

$scope.init();

编辑：plunkr

Answer 1

你可以尝试添加params选项：

$stateProvider
  .state('home', {
    name: 'home',
    params: {
      id: null
    },
    url: '/',
    templateUrl: 'views/main.html',
    controller: 'MainCtrl'
  })
  .state('home.modal', {
    url: 'modal/:id/',
    data: {
      modalState: true
    },
    controller: 'MainCtrl'
  });

子状态 home.modal 应该继承父级的参数。关于你从一个州到另一个州的ui-sref，像这样传递参数：

<a ui-sref="home.modal({ id: x })"></a>

然后你的网址会变成/ modal /：x（其中x是数字）。

此外，$ stateParams应该按照您的意愿显示参数。

使用ui-router的undefined stateParams

1 个答案: