AngularJS - 更新$ route参数的最佳方法

Question

我有几个不同的路由,但包含类似的参数.
例:

when '/user/:accountId/charts/:chartType', controller:ChartsController
when '/manager/:accountId/charts/:chartType', controller:ChartsController
when '/whatever/pathy/paththingy/charts/:chartType', controller:ChartsController

请注意,所有三个视图都使用相同的图表控制器来控制视图.它是一个相当通用的控制器,但它需要在可用的图表类型之间切换...同时保持其余的路线.
示例:(这不起作用)

if my currrent url is '/user/001/charts/comparison'
Then I call something like:
$route.current.params.chartType = 'newChart';
$route.reload(); // or soemthing similar?
I want the url to become '/user/001/charts/newChart'

有没有人知道如何在不完全重新键入或重建路径路径的情况下轻松更新路径参数？

Answer 1

从角度1.3开始,您可以使用$route.updateParams(newParams)更改路径参数.

以下是角度文档的引用...

$ route.updateParams(newParams);

使$route服务更新当前URL,将当前路由参数替换为中指定的参数newParams.提供的与路径的路径段定义匹配的属性名称将插入到位置的路径中,而其余属性将被视为查询参数.

Answer 2

如果可能的话,我建议你改用ui-router.它在许多方面比ngRoute更强大.

从本质上讲,这个模块有一个更高级别的概念,称为状态包装底层路由,这使您无法直接使用较低的路由级别(如路由URL).

为了比较:angular-route和angular-ui-router之间有什么区别？

使用ui-router,您可以像这样实现您的代码:

$stateProvider
  .state('user.chart', {
     url: '/user/:accountId/charts/:chartType',   
     controller: "ChartsController"   
  })
 .state('manager.chart', {
     url: '/manager/:accountId/charts/:chartType', 
     controller: "ChartsController"
  })
 .state('pathy.chart', {
     url: '/whatever/pathy/paththingy/charts/:chartType', 
     controller: "ChartsController"
  })

您可以使用此代码在状态之间导航:

$state.go('user.chart',{chartType:'newChart'},{inherit:true});

文档

Answer 3

缺乏这个简单的功能让我感到恼火,所以我实施了它并在GitHub上提交了PR