将URL与AngularJS UI路由器中的单词数组列表匹配

Question

使用AngularJS + ui-router，我需要将URL与单词列表匹配：

但是，我使用正则表达式尝试使用一个或两个单词，但它确实有效

 url: '/{source:(?:John|Paul)}/:id'

但是我需要将我的网址与单词列表进行匹配。

例如：var sourceList = [‘John’，’Paul’，’George’，’Ringo’]; 网址：“ / {source :( ??
sourceList）} /：id”

有没有办法将我的网址与数组的匹配列表进行比较？

Answer 1

无法完全确定您要搜索的内容是什么，因为它可能是动态网址匹配器，也可能只是智能正则表达式。这是一个有工作实例的小伙子。它实际上是1）只有建立从名字......
2）所示的传递的列表正则表达式urlMatcher在行动

答案是：使用UrlMatcher。

[$ urlMatcherFactory和UrlMatchers](https://github.com/angular-ui/ui-

router/wiki/URL-Routing#urlmatcherfactory-and-urlmatchers)

定义URL模式和参数占位符的语法。$
urlRouterProvider在后台使用此工厂服务来缓存编译的UrlMatcher对象，而不必在每次位置更改时重新解析url模式。大多数用户不需要直接使用$
urlMatcherFactory，但是制作UrlMatcher对象并将其作为url传递给状态配置可能很有用。

例：

var urlMatcher = $urlMatcherFactory.compile("/home/:id?param1");
$stateProvider.state('myState', {
    url: urlMatcher 
});

plunker中的示例：

  var sourceList= ['John', 'Paul', 'George', 'Ringo']
  var names = sourceList.join('|');
  var urlMatcher = $urlMatcherFactory.compile("/{source:(?:" + names + ")}/:id");

  $stateProviderRef 
    .state('names', { 
      url: urlMatcher,
      templateUrl: 'tpl.root.html',
      controller: 'MyCtrl'
    });

该示例显示了更复杂的解决方案。如果在cofnig阶段确实有名称列表，则简单的连接应该起作用。但是，如果稍后可.run()通过（$http…
）使用该解决方案，则此解决方案可能会有所帮助