如何在 Angular JS 中为 :slug 状态设置低优先级

Question

我正在使用 Angular UI 路由器，并且我设置了两条路由

一个用于所有内容页面，如 /about、/terms 等

$stateProvider.state('sidebarPages.page', {
            url: ':slug',
            views : {
             ...  
            }
});

现在我想为我们的团队等其他页面添加另一个

$stateProvider.state('sidebarPages.page', {
                url: 'our-team',
                views : {
                 ...  
                }
 });

问题是当我转到页面 /our-team 时，第二个状态被忽略，第一个状态被执行，即 :slug ，并且可以接受所有内容。

有没有一种方法可以创建这两种状态，一种用于特定页面，另一种将接受所有内容并将其放入 slug 参数中，然后基于参数我可以从数据库中获取它。

Answer 1

我创建了 working plunker here。顺序决定。创建具有已知名称的状态，然后是带有 slug 的状态：

    // States
    $stateProvider
      .state('home', {
          url: "/home",
          templateUrl: 'tpl.html',
      })
      .state('other', {
          url: "/other",
          templateUrl: 'tpl.html',
      })
      .state('slug', { 
          url: "/:slug",
          templateUrl: 'tpl.html',
      })
      ;

检查一下here

如何在 Angular JS 中为 :slug 状态设置低优先级

How to set low priority for :slug state in Angular JS

angularjs

angular-ui-router

state