如何在角度ui-router状态下添加guid正则表达式

Question

我有这条路

.state('mystate', {
    url: '/{id}',
    templateUrl: '/views/partial.html'
});

id param应该是像这样的"2a542f61-5fff-4607-845d-972e6c3ad1e4"形式的guid.我如何在网址"url:'/ {id:？我应该放在这里}}"中添加这个.

Answer 1

您可以定义自己的参数类型.

var GUID_REGEXP = /^[a-f\d]{8}-([a-f\d]{4}-){3}[a-f\d]{12}$/i;
$urlMatcherFactoryProvider.type('guid', {
  encode: angular.identity,
  decode: angular.identity,
  is: function(item) {
     return GUID_REGEXP.test(item);
  }
});

这是一个关于这个解决方案的plunker 的展示

然后在url route表达式中指定此类型:

.state('mystate', {
  url: '/{id?guid}',
  templateUrl: '/views/partial.html'
});

您可以在文档中阅读该页面上的更多内容

Answer 2

有一个工作的plunker

我们可以在url定义中提供regexp:

url: "/{id:(?:[a-fA-F0-9]{8}(?:-[a-fA-F0-9]{4}){3}-[a-fA-F0-9]{12})}",

详细了解我们的网址定义选项:

http://angular-ui.github.io/ui-router/site/#/api/ui.router.util.type:UrlMatcher

小片段:

'{' name ':' regexp|type '}' - 带有正则表达式或类型名称的卷曲占位符.如果regexp本身包含花括号,它们必须是匹配对或使用反斜杠转义.