AngularJs UI路由器 - 一个具有多个URL的状态

Question

我有一个请求添加另一个URL参数,该参数指向我已经设置的状态.为了提高效率,我试图看看是否可以添加多个URL以指向相同的状态,或者我应该只使用$ UrlRouterProvider.when()方法在这种新情况下重定向到该状态.

防爆.这就是已经存在的东西

.state('site.link1',
  {
    url: '/link1',
    templateUrl: '/views/link1.html',
    controller: 'link1Ctrl'
  })

并且要求添加指向link1页面的www.site.com/newlink.有这样的事情;

.state('site.link1',
  {
    url: '/link1, /newlink',
    ...

Answer 1

你使用参数:

https://github.com/angular-ui/ui-router/wiki/URL-Routing

.state('site.link',
{
    url: '/{link}'
    ..
}

所以当你使用相同的状态时

$state.go('site.link', {link: 'link1'})
$state.go('site.link', {link: 'link2'})

Answer 2

尝试使用正则表达式和网址中的参数.它不是最佳的,但有效.

.state('site.link1',
 {
   url: '/{path:link1|newlink}',
   templateUrl: '/views/link1.html',
   controller: 'link1Ctrl'
 })

有关Urls中正则表达式的更多信息.

生成链接时ui-sref,将状态名称作为函数传递相同的参数

<a ui-sref="site.link1({path:'link1'})" >site link 1</a>
<a ui-sref="site.link1({path:'newlink'})">site new link</a>

Answer 3

你可以使用when() 功能

.state('site.link1',
  {
    url: '/link1',
    templateUrl: '/views/link1.html',
    controller: 'link1Ctrl'
  })

然后在root配置上

angular.module('myApp', [...])
   .config(function ($urlRouterProvider) {
       $urlRouterProvider.when(/newlink/, ['$state','$match', function ($state, $match) {
           $state.go('site.link1');
       }]);
    });