AngularJS 路由，在显示 slug 时使用 ui-sref 传递 id 而不是 url 中的 id

Question

我将概述我已经设置的内容以及我想要工作的内容：

我的模板中有这样一个项目列表：

<ul>
    <li ng-repeat="user in users">
        <a ui-sref="user({slug: user.slug, id: user.id})">
            {{user.name}}
        </a>
    </li>
</ul>

我有一个像这样的状态提供者：

.state('user', {
    url: '/:slug',
    controller: 'UserCtrl',
    templateUrl: 'app/user/userProfile.html',
    resolve: {
         user: function($stateParams, UserService) {
             return UserService.get($stateParams.id);
         }
    }
});

现在我明白这不起作用，因为 id 参数没有在 url 中定义，所以它没有传递给 $stateParams。我已经看到类似的问题回答了使用这样的建议：

resolve: {
     user: function($stateParams, UserService) {
         var userId = UserService.getIdFromSlug($stateParams.slug);
         return UserService.get(userId);
     }
}

但是 getIdFromSlug 方法要么需要另一个 API 调用，要么当我获得列表时，在服务中创建一个映射对象，如 { slug: id }。两者似乎都不是非常优雅的解决方案，尤其是因为我已经有了 id.

我错过了什么吗？没有其他方法可以将参数传递给状态提供者吗？（我是 Angular 的新手）。

Answer 1

.state('user', {
    url: '/:slug',
 params: { id: { value: -1 } },

我已经使用了上面的方法，所以在 url 中没有传递 ID。

Answer 2

您可以同时传递 slug 和 id ，但是您必须在 url

中同时进行编码

url: '/:slug/:id'

像这样你可以同时通过

Answer 3

您可以在url中添加id喜欢

url: '/:slug/:id'

或者将其视为如下查询字符串

url: '/:slug&id

AngularJS 路由，在显示 slug 时使用 ui-sref 传递 id 而不是 url 中的 id

AngularJS routing, pass id with ui-sref while displaying a slug and not the id in the url

javascript

angularjs

angularjs-routing

angular-routing