一尘不染

如何使用Angular $ location通过动态更改其键值参数来设置新的url位置?

angularjs

假设我有一个RESTful端点,该端点接受一系列构面来查询数据。以下是一些示例:

example.com/search?type=Doctor&location=Boston,MA&radius=2  
example.com/search?type=Facility&location=Wayne,NJ&radius=3&gender=f  
example.com/search?type=Doctor&location=Patterson,NJ

我的模块接受查询对象来执行搜索:

console.log(query);
{
  type:'Doctor',
  location:'Boston,MA',
  radius:'2'
}

$scope.getSearch = function(query){
  var search = $search.search(query);
  search.getResults(function(results){
    $scope.results = results;
  });
}

这些方面正在通过Web表单的本地模型传递:

 <input type="text" ng-model="query.location"/>
 <input type="text" ng-model="query.radius"/>
 <button type="button" ng-click="getSearch(query)">Search</button>

在该getResults函数的成功回调中,我试图像上面的示例一样将查询参数附加到URL:

$scope.getSearch = function(query){
  var search = $search.search(query);
  search.getResults(function(results){
    $scope.results = results;
    search.appendQueryToURL(query);
  });
}

如何在AngularJS中动态附加URL参数?


阅读 335

收藏
2020-07-04

共1个答案

一尘不染

使用$ location

$location.path('/newValue').search({key: value});

对于Non AngularJS应用程序:

您可以使用history.js将参数动态附加到URL。然后分割网址以获取参数并传递给angular:

History.replaceState({state:1}, "State 1", "?Param1=something");

我建议将history.js作为IE使用,直到ver9不支持历史记录对象推送状态,如果要使用IE10 +或google
chrome,请使用历史记录状态对象更新url。希望能帮助到你 :)

2020-07-04