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

您可以在网址中添加id，例如

url: '/:slug/:id'

或将其视为查询字符串，如下所示

url: '/:slug&id

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

3 个答案: