用于 AngularJS 的 ui-router 中没有 URL 的状态参数

问题描述

我正在使用 ui-router 来表示我的 AngularJS 应用程序中的状态.在其中，我想在不更改 URL 的情况下更改状态(基本上更新了详细视图"，但这不应该影响 URL).

I am using ui-router to represent states in my AngularJS app. In it I'd like to change the state without changing the URL (basically a "detail view" is updated but this should not affect the URL).

我使用 <a ui-sref="item.detail({id: item.id})"> 来显示详细信息，但这仅在我指定像 url: "/detail-:id" 在我的 $stateProvider 中.

I use <a ui-sref="item.detail({id: item.id})"> to display the detail but this only works if I specify a URL like url: "/detail-:id" in my $stateProvider.

在我看来，当前状态只能通过 URL 定义.

It seems to me that the current state is only defined through the URL.

推荐答案

感谢您的回答，它确实帮助我找到了正确的方向，但我只想添加更完整的描述.

Thanks for your answer, it did help me in the right direction but I'd just like to add a more complete description.

在我的具体问题中，有一个复杂因素，因为我需要将非 URL 参数注入的状态是子状态.稍微复杂一点.

In my specific issue there was a complicating factor because the state I needed to inject a non-URL parameter to was a child state. That complicated things slightly.

params: ['id'] 部分位于 $stateProvider 声明中，如下所示:

The params: ['id'] part goes in the $stateProvider declaration like this:

$stateProvider.state('parent', {
    url: '/:parentParam',
    templateUrl: '...',
    controller: '...'
}).
state('parent.child', {
    params: ['parentParam','childParam'],
    templateUrl: '...',
    controller: '...'
});

并且参数名称像这样连接到 ui-sref 属性:

And the param name is connected to the ui-sref attribute like this:

<a ui-sref=".child({ childParam: 'foo' })">

问题是这样的:

如果父状态也有一个 URL 参数，那么子状态需要也在其 params 数组中声明.在上面的示例中，parentParam"必须包含在 childstate 中.

如果你不这样做，那么在应用程序初始化时将会抛出一个模块错误.至少在撰写本文时的最新版本 (v.0.2.10) 上是这样.

If you don't do that then a module-error will be thrown when the application is initialized. This is at least true on the latest version at the time of writing (v.0.2.10).

编辑

@gulsahkandemir 指出

@gulsahkandemir points out that

状态定义中的 params 声明已更改为 params:{id: {} } 来自参数: ['id']

从变更日志来看，似乎是从 v0.2.11 开始的情况

Judging by the changelog, this seems to be the case starting from v0.2.11

参数详情可以在官方文档中找到

这篇关于用于 AngularJS 的 ui-router 中没有 URL 的状态参数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！