Angular ui-路由器：重新加载时访问 $stateParams

Question

在我的 Angular 应用程序中，我有这样的路由结构：

.state('mapping', {
    url: '/mapping',
    templateUrl: 'app/components/mapping/mapping.html',
    controller: 'MapCtrl as map',
    abstract: true,
    authenticate: true
})
.state('mapping.all', {
    url: '',
    templateUrl: 'app/components/mapping/partials/all.html',
    authenticate: true
})
.state('mapping.project', {
    url: '/:projectName',
    controller: 'ProjectCtrl as proj',
    templateUrl: 'app/components/mapping/partials/project.html',
    authenticate: true
})

预期的功能是，当用户访问 'mapping.project' 时，应用程序将使用 projectID 变量加载与该项目相关的所有相关信息，该变量通过 $stateParams 传递（不可见）使用 ui-sref:

ui-sref="mapping.project({projectId: project.id, projectName: project.name})"

然而，这会导致不良行为：当用户在已经处于 'mapping.project' 状态时重新加载页面，将不会加载任何内容，因为没有 $stateParams 被有效传递。

重新加载时获得 projectId 的最佳方法是什么（和确保我的控制器再次启动）而不在 URL 上显示它？

Answer 1

在这种情况下，如果我们希望我们的参数在页面重新加载（或在新 tab/window 中打开）后仍然存在，它们只是必须是 URL。所以这样做的方法是用 projectId:

扩展 URL 定义

.state('mapping.project', {
    url: '/:projectName?projectId',
    ...
})

这会将 projectId 添加为 "query string param"。另一种选择是 params nesting

.state('mapping.project', {
    url: '/:projectName/:projectId',
    ...
})

还要检查这个：How to pass parameters using ui-sref in ui-router to controller

Angular ui-路由器：重新加载时访问 $stateParams

Angular ui-router: accessing $stateParams on reload

javascript

state

parameter-passing

angularjs

angular-ui-router