Question

我有一个棘手的问题，我暂时无法解决。

基本上，当我在某个$route并且我确定$state.go(routeName, params);时，我需要在网址上附加一个parameter或多个parameters。

另外，要注意路径也可以在没有参数的情况下访问，所以必须要干净。

我想实现这个结果：

实际网址：localhost:4000
通缉网址：localhost:/4000/myRoute/myStuff/myParam
如果提供了没有参数的localhost:/4000/myRoute//，请避免使用$state.go(myRoute)。

例如：

$state.go(myRoute, {
   param1 : 'myStuff',
   param2 : 'myParam'
});

function myRoute($stateProvider) {

    $stateProvider
        .state('myRoute', {
            url: 'myRoute/{param1}{param2}',
            parent: 'myParent'
              . . .
        })
}

可以工作，但是会给localhost:/4000/myRoute/myStuffmyParam。

所以，我尝试使用/作为分隔符url: 'myRoute/{param1}' + '/' + '{param2}' 它工作得很好，我得到localhost:/4000/myRoute/myStuff/myParam。

但是，当然，即使没有参数，也会附加/。例如，执行$state.go('myRoute')会导致localhost:/4000/myRoute//明显错误。

现在，我告诉自己，好吧，如果我只是将它添加到param1我将实现我所需要的。

所以，我尝试了

param1 : 'myStuff' + '/'
param1 : 'myStuff' + '\/'
param1 : 'myStuff/'
param1 : 'myStuff\/'

但所有都会导致相同的网址localhost:4000/myRoute/myStuff~2FmyParam。然而，如果我使用像-这样的其他分隔符，它就可以了。

param1 : 'myStuff-'会导致localhost:4000/myRoute/myStuff-myParam

修改

使用{param}和:param是一样的。参考angular-ui/ui-router URL Routing

我找不到任何解决方案，也会查看way to create optional parameter in url?提供的答案。尝试myRoute[/:param1[/:param2]]也会产生错误。

修改

同时尝试param1%2F或'param1' + '%2F'也无效。我分别得到~2F＆amp; %252f作为分隔符。同样做decodeURI('%2F')导致同样悲惨的结果。

使用此类分隔符的正确方法是什么，避免在没有参数时附加它并且还能正确呈现？

如有任何澄清，请发表评论。提前谢谢。

Answer 1

$stateProvider.state('state', {
    url: "/state/:id/:name/:something",
    templateUrl: "bla.html",
    controller: 'BlaCtrl'
  });

$state.go('state', {id: 1, name: 'pepe', something: 'nothing'});

这对我有用，产生： / state / 1 / pepe / nothing

Answer 2

你不能创建一条母亲路线和一条儿童路线吗？这不可能吗？

Answer 3

你不需要制造所有这类机器来达到你想要的效果。正如@trichetriche所说，你可以创建一组特定的子路径。

您需要修改$routeProvider之类的内容：

//for the clean url - localhost:/4000/myRoute/
$stateProvider
    .state('myRoute', {
        url: 'myRoute/',
        parent: 'myParent'
          . . .
})
//for myStuff/param1 url - localhost:/4000/myStuff/param1
$stateProvider
    .state('myRoute.myStuff', {
        url: 'myStuff/{param1}', //also adding other params
        parent: 'myRoute'
          . . .
})

如果需要，您可以根据需要添加任意数量的儿童。

分别为$ state.go＆＃39>：

$state.go('myRoute');
$state.go('myRoute.myStuff', { param1 : 'HeyOhLetsGo' });

在Url - Angular-Ui-Router中使用“/”作为参数的可选分隔符

3 个答案: