javascript - AngularJS:如何根据条件检查选择 state.go 中的 url？

Question

在提出我的问题之前，我知道围绕这个主题有很多话题，但实际上没有一个与我的问题有任何关系。

在我的 angularJS 应用程序中，我使用 $stateProvider 来切换状态。但是，我的应用程序要求我传递查询字符串参数并且我想保留它们。

我是这样做的

$rootScope.$state.go('defaultState', {id: 12});

然后我执行以下操作

$stateProvider.state('defaultState', {
url: /test/?id,
params: { id: {value: ""} },
templateUrl: 'testTemplate.html'
});

所以现在当我切换到我的状态时，我可以看到如下的url

/test/?id=12

这就是我想要的，太棒了!

但是，假设在某些情况下我会在不传递参数的情况下调用 $rootScope.$state.go('defaultState')。那样的话，我会得到一个如下的url

/test/?id=

这很奇怪!我只想在检测到参数时才添加参数查询字符串!

所以我想做这样的事情

$stateProvider.state('defaultState', {
url: id ? '/test/id?' : '/test/',
params: { id: {value: ""} }, ..

所以如果为空，我们选择第二个 url 而不是第一个，但这不起作用，我得到 id 未定义..

有没有办法在没有第二个状态和第二个基于条件的 $state.go() 的情况下做我想做的事情？

我可以在 $state.go('', {}, .. ) 中传递一个变量并检查它而不是检查条件参数吗？

谢谢

Answer 1

1. 引用文档查询参数超过here ,你的状态定义:

   $stateProvider.state('defaultState', {
   url: /test/?id,
   params: { id: {value: ""} },
   templateUrl: 'testTemplate.html'
   });
   

   尝试将两种不同的查询参数技术结合在一个地方。

2. 然而，这不是真正的问题，只需删除参数就足够了，就像这样:

   $stateProvider.state('defaultState', {
   url: /test/?id,
   templateUrl: 'testTemplate.html'
   });
   

3. 实际发生的是这里的这一行 params: { id: {value: ""} 将 id 初始化为零长度字符串，它是也是一个有效的查询参数，因此您可以看到 /test/?id=，这实际上是根据您设置的规则应该发生的事情。

4. 此外，params: { id: ""} 可能足以实现与 params: { id: {value: ""} 相同的效果。因此，如果您在其他地方使用 params，您可能需要对其进行一些重构，以保持整洁。