一尘不染

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

angularjs

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

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

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

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

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

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


阅读 218

收藏
2020-07-04

共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
)使用该解决方案,则此解决方案可能会有所帮助

2020-07-04