Angular ui.router,创建可选的第一路径参数 [英] Angular ui.router, Creating an Optional First Path Param

查看:60
本文介绍了Angular ui.router,创建可选的第一路径参数的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

使用Angular相对较新,但是我似乎找不到任何url别名或完全可选的路径参数(使用ui.router的$stateProvider时类似{/var1}/:var2.

Relatively new to working with Angular, but I couldn't seem to find any url aliasing or fully optional path params (something like {/var1}/:var2 when using ui.router's $stateProvider.

我希望使以下两个都是有效路径,理想情况下是在同一状态声明上,以便我可以使用一个或两个参数来调用状态更改.

I'm looking to have the following both be valid paths, ideally on the same state declaration so that I can call state changes using one or both params.

/var1/var2
/var2

自然地,我可以使用如下所示的匹配项,但是这些都不是真正的解决方案.

Naturally, I can use matches like the following, but none of these are true solutions.

  • /:var1/:var2,但这仍然需要var1(//var2)的空值
  • /:var2?var1/:var2/:var1?,但这两个都不是 在重新布置路径的情况下非常理想.
  • /:var1/:var2/:var2作为单独的状态,但是我可能需要更紧密地管理状态更改,并根据可用的参数进行选择.
  • /:var1/:var2, but this still requires an empty value for var1 (//var2)
  • /:var2?var1 or /:var2/:var1?, but neither of these are ideal in context as they rearrange the path.
  • /:var1/:var2 AND /:var2 as separate states, but I'd likely need to manage state changes more closely and select based on which params are available.

任何向我指出正确方向的信息将不胜感激.

Any info to point me in the right direction would be greatly appreciated.

然后快速精简示例以了解上下文.

And a quick stripped down sample for context.

$stateProvider .state('app.view', { url : '/:var1/:var2' }).state('app.view2', { url : '/:var2' });

$stateProvider .state('app.view', { url : '/:var1/:var2' }).state('app.view2', { url : '/:var2' });

推荐答案

也许可行

.state('app.view', {
    url: '/:var1/:var2',
    templateUrl: 'yourTpl.html',
    controller: 'YourCtrl',
    params: {
        var1: {squash: true, value: null}
    }
})

squash配置当当前参数值与默认值相同时,如何在URL中表示默认参数值

squash configures how a default parameter value is represented in the URL when the current parameter value is the same as the default value

这篇关于Angular ui.router,创建可选的第一路径参数的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆