假设我有一个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:
getResults
$scope.getSearch = function(query){ var search = $search.search(query); search.getResults(function(results){ $scope.results = results; search.appendQueryToURL(query); }); }
如何在AngularJS中动态附加URL参数?
使用$ 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。希望能帮助到你 :)