HTML源代码
<div ng-app="">
<div ng-controller="test">
<div ng-address-bar browser="html5"></div>
<br><br>
$location.url() = {{$location.url()}}<br>
$location.search() = {{$location.search('keyword')}}<br>
$location.hash() = {{$location.hash()}}<br>
keyword valus is={{loc}} and ={{loc1}}
</div>
</div>
AngularJS源代码
<script>
function test($scope, $location) {
$scope.$location = $location;
$scope.ur = $scope.$location.url('www.html.com/x.html?keyword=test#/x/u');
$scope.loc1 = $scope.$location.search().keyword ;
if($location.url().indexOf('keyword') > -1){
$scope.loc= $location.url().split('=')[1];
$scope.loc = $scope.loc.split("#")[0]
}
}
</script>
这里变量loc和loc1都返回test作为上述URL的结果。这条路对吗?
当使用angularjs和express
在我的例子中,我使用angularjs与express做路由,所以使用$routeParams会打乱我的路由。我使用下面的代码来得到我所期待的:
const getParameters = (temp, path) => {
const parameters = {};
const tempParts = temp.split('/');
const pathParts = path.split('/');
for (let i = 0; i < tempParts.length; i++) {
const element = tempParts[i];
if(element.startsWith(':')) {
const key = element.substring(1,element.length);
parameters[key] = pathParts[i];
}
}
return parameters;
};
它接收一个URL模板和给定位置的路径。我只是用:
const params = getParameters('/:table/:id/visit/:place_id/on/:interval/something', $location.path());
把所有这些放在一起我的控制器是:
.controller('TestController', ['$scope', function($scope, $window) {
const getParameters = (temp, path) => {
const parameters = {};
const tempParts = temp.split('/');
const pathParts = path.split('/');
for (let i = 0; i < tempParts.length; i++) {
const element = tempParts[i];
if(element.startsWith(':')) {
const key = element.substring(1,element.length);
parameters[key] = pathParts[i];
}
}
return parameters;
};
const params = getParameters('/:table/:id/visit/:place_id/on/:interval/something', $window.location.pathname);
}]);
结果将是:
{ table: "users", id: "1", place_id: "43", interval: "week" }
希望这能帮助到一些人!
我发现解决方案如何使用$location.search()从URL获取参数
首先在URL中,你需要把语法“#”放在参数之前,就像这个例子一样
“http://www.example.com/page ?键=值”
然后在你的控制器你把$location函数和使用$location.search()获取URL参数
.controller('yourController', ['$scope', function($scope, $location) {
var param1 = $location.search().param1; //Get parameter from URL
}]);
虽然路由确实是应用程序级URL解析的一个很好的解决方案,但你可能想要使用更低级的$location服务,就像注入到你自己的服务或控制器中一样:
var paramValue = $location.search().myParam;
这个简单的语法适用于http://example.com/path?myParam=paramValue。然而,只有当你在HTML 5模式下配置了$locationProvider:
$locationProvider.html5Mode(true);
除此之外,还可以看看http://example.com/#!/path?myParam=someValue“Hashbang”语法,它稍微复杂一些,但也有在旧浏览器(非html 5兼容)上工作的好处。