问题描述
限时送ChatGPT账号..我正在使用 AngularJD ui-router 来捕获我的 URL 并将两个参数从该 URL 发送到我的控制器.这是我的要求:
I'm using AngularJD ui-router to capture my URL and send two parameters from that URL to my controller. Here are my requirements:
第一个参数是一个强制整数(id
)第二个参数是一个可选字符串(slug
)两个参数用/
分隔我希望它忽略任何单个尾随 /
目前,我正在这样做:
$stateProvider.state('mystate',
{
url: '/mystate/{id:int}{slug:(?:/[^/]+)?}',
params: {
slug: {value: null}
},
templateUrl: 'partials/mystate.html',
controller: function($stateParams) {
console.log('$stateParams.id=',$stateParams.id, ' $stateParams.slug=',$stateParams.slug);
}
}
对于 URL:mystate/1
这正确捕获:
For URL: mystate/1
This correctly captures:
$stateParams.id=1, $stateParams.slug=null
对于 URL:mystate/1/myslug
这捕获了 slug
的错误值:
For URL: mystate/1/myslug
This captures the wrong value for slug
:
$stateParams.id=1, $stateParams.slug=/asdad
对于 URL:mystate/1/
这不会捕获任何内容.
For URL: mystate/1/
This doesn't capture anything.
对于 URL:mystate/1/myslug/
这不会捕获任何内容.
For URL: mystate/1/myslug/
This doesn't capture anything.
我该如何编写它才能正确捕获上述所有四个 URL,但不会将任何 /
传递给控制器?
How can I write this so that it captures all four of the aforementioned URLs properly but doesn't pass any of the /
s to the controller?
推荐答案
对于可选的尾部斜杠,您需要 在配置块中将严格模式设置为 false:
For optional trailing slash, you need to set strict mode to false in a config block:
angular.module('yourModule').config(['$urlMatcherFactoryProvider', function($urlMatcherFactoryProvider) {
$urlMatcherFactoryProvider.strictMode(false);
}]);
对于可选参数,这里有很长的讨论.最后,他们建议使用 squash
:
For having optional parameters, there's a long discussion here. At the end, they suggest using squash
:
$stateProvider.state('mystate',
{
url: '/mystate/{id:int}/:slug',
params: {
slug: {value: null, squash: true}
},
templateUrl: 'partials/mystate.html',
controller: ['$stateParams', function($stateParams) {
console.log('$stateParams.id=',$stateParams.id, ' $stateParams.slug=',$stateParams.slug);
}]
}
squash
有很好的 documentation,如果你设置为true,当它有默认值时,它会省略URL中的参数.
squash
has good documentation, if you set it to true, it omits the parameter from URL when it has the default value.
这篇关于如何使用 AngularJS UI-router 使用可选参数捕获此 URL?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
更多推荐
[db:关键词]
发布评论