角UI路由器動態PARAMS雙斜線

Question

我有UI的路由器的配置如下圖所示：

.state('xxx.components',{ 
      url: '/:runId/component', 
      reloadOnSearch: false, 
      templateUrl: '/modules/xxx//views/cloud-components/templates/cloud-components.tpl.html', 
      controller: 'CloudComponentsCtrl', 
      controllerAs: 'ctrl' 
     }) 

，如果我去到組件頁面沒有任何runid，請在網址看起來象下面這樣：

http://localhost:3031/xxx/run-topologies//component 

它將在url中包含雙斜槓，我希望它只包含一個像下面的斜槓，我應該怎麼做才能解決這個問題？

期望的行爲：

使用runid：（這是正確的，由於當前的配置）

http://localhost:3031/xxx/run-topologies/6/component 

沒有runid爲：（應該只有1個斜線）

http://localhost:3031/xxx/run-topologies/component 

Answer 1

你所問的是不可能的AFAIK。但是，有兩種方法可能會對兩條路線使用CloudComponentsCtrl感興趣。

1. 定義與URL的單獨狀態而不的runid

   .state('xxx.components',{ 
       url: '/component', 
       reloadOnSearch: false, 
       templateUrl: '/modules/xxx/views/cloud-components/templates/cloud-components.tpl.html', 
       controller: 'CloudComponentsCtrl', 
       controllerAs: 'ctrl' 
   }) 
   .state('xxx.componentsForRunId',{ 
       url: '/:runId/component', 
       reloadOnSearch: false, 
       templateUrl: '/modules/xxx/views/cloud-components/templates/cloud-components.tpl.html', 
       controller: 'CloudComponentsCtrl', 
       controllerAs: 'ctrl' 
   }) 
   

2. 從路線中刪除的runid和它包括作爲查詢參數。

   .state('xxx.components',{ 
       url: '/component?runId', 
       reloadOnSearch: false, 
       templateUrl: '/modules/xxx/views/cloud-components/templates/cloud-components.tpl.html', 
       controller: 'CloudComponentsCtrl', 
       controllerAs: 'ctrl' 
   }) 
   

   然後，您可以從您的$stateParams訪問runId。

希望能以某種方式解決您的問題。