AngularJS - 更新$路由参数的最佳方法(AngularJS - Best way to

2019-08-03 08:10发布

我有几个途径是不同的,但包含类似的参数。
例:

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

请注意,所有三个视图使用相同的图表控制器来控制视图。 它是一种非常通用的控制器,但它需要切换可用chartTypes之间......同时保持路径的其余部分。
例如:(这不起作用)

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'

有没有人有任何想法如何轻松地更新路由的参数,而不完全重新typeing或重建的路线路径?

Answer 1:

由于角1.3你可以用$route.updateParams(newParams)改变路线PARAMS。

下面是从角文档报价...

$ route.updateParams(newParams);

原因$route服务来更新当前的URL,替换那些在规定的电流路径参数newParams 。 匹配路由的路径段定义所提供的属性名称将被插入到该位置的路径,而其余的属性将作为查询参数进行处理。



Answer 2:

如果可能的话,我会建议你使用UI路由器来代替。 它比ngRoute更强大的许多方面。

从本质上讲,该模块有一个名为状态包装它使您免受直接与较低的路径级航路网址工作的基本路线更高层次的概念。

对于一个比较: 是什么角度,路线和角度的UI路由器之间的区别?

随着用户界面的路由器,可以实现这样的代码:

$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上提交了一份公关



文章来源: AngularJS - Best way to update $route parameter