如何访问ui路由器的UrlMatcher？

Question

In the documentation of ui-router there is a object named UrlMatcher which i need to access it in order to use some methods (such as exec ) but i cannot find any clear instructions on how to do it. However that object is described on the documentation page.

I want to be able to do something like:

new UrlMatcher('/user/{id}?q&r').exec('/user/bob', {
  x: '1', q: 'hello'
});

How can i access that object?

urlMatcherFactory.js on Github

Answer 1

Angular has $urlMatcherFactory and UrlMatchers .

Plunker: http://plnkr.co/edit/MdazdvpVKjZhNjI6ErAH?p=preview

angular.module('myApp',[]).run(['$urlMatcherFactory',
    function($urlMatcherFactory) {

      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'
        });
    }
  ]);

Refer: Discussion on ui-router's UrlMatcher .

Using exec:

URL: /home/1?param1=tt

 var urlMatcher = $urlMatcherFactory.compile("/home/:id?param1");
    var matched = urlMatcher.exec($location.path(), $location.search());

you get 2 fields : id ==> 1 and param1 ==> tt