$location.search
,文档中指出:
当没有参数调用时,返回当前URL的搜索部分(作为对象)。
在我的URL中,我的查询字符串有一个没有值的参数?test_user_bLzgB
。此外,$location.search()
返回一个对象。我该如何获得实际文本?
$location.search
,文档中指出:
当没有参数调用时,返回当前URL的搜索部分(作为对象)。
在我的URL中,我的查询字符串有一个没有值的参数?test_user_bLzgB
。此外,$location.search()
返回一个对象。我该如何获得实际文本?
我不确定自从被接受的答案被接受以来是否有更改,但是这是可能的。
$location.search()
会返回一个键值对的对象,与查询字符串中的相同。没有值的关键字只存储为true。在本例中,该对象将如下所示:
{"test_user_bLzgB": true}
您可以直接使用$location.search().test_user_bLzgB
访问此值。
示例(带有更长的查询字符串):http://fiddle.jshell.net/TheSharpieOne/yHv2p/4/show/?test_user_bLzgB&somethingElse&also&something=Somethingelse
注意:由于哈希(它将转到http://fiddle.jshell.net/#/url,这会创建一个新的fiddle),因此在不支持js历史记录的浏览器中(在IE <10中不起作用),此小提琴将无法正常工作。
编辑:
如@Naresh和@DavidTchepak在评论中指出的那样,$locationProvider
也需要正确配置:https://code.angularjs.org/1.2.23/docs/guide/$location#-location-service-configuration
$locationProvider
:https://code.angularjs.org/1.2.23/docs/guide/$location#-location-service-configuration(这让我有些困惑。希望这个链接可以节省其他人的时间。) - David Tchepak$window.location.search
。$location.search()
返回一个对象,其中键为变量,值为其值。因此:如果您像这样编写查询字符串:
?user=test_user_bLzgB
你可以轻松地获取文本,方法如下:
$location.search().user
如果您不想使用键/值对的形式,例如?foo=bar,我建议使用哈希#test_user_bLzgB,并调用$location.hash()
将返回'test_user_bLzgB',这是您希望检索的数据。
其他信息:
如果您使用查询字符串方法并且使用$location.search()返回空对象,则可能是因为Angular使用了hashbang策略而不是html5策略...为使其正常工作,请将此配置添加到您的模块中:
yourModule.config(['$locationProvider', function($locationProvider){
$locationProvider.html5Mode(true);
}]);
首先,使获取查询字符串的URL格式正确,使用#?q=string 对我有用
http://localhost/codeschool/index.php#?foo=abcd
将 $location 服务注入到控制器中
app.controller('MyController', [ '$location', function($location) {
var searchObject = $location.search();
// $location.search(); reutrn object
// searchObject = { foo = 'abcd' };
alert( searchObject.foo );
} ]);
因此输出应为abcd
您也可以使用这个
function getParameterByName(name) {
name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
results = regex.exec(location.search);
return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}
var queryValue = getParameterByName('test_user_bLzgB');
如果你的$location.search()
没有起作用,请确保你完成了以下步骤:
1)在应用程序模块配置中配置了html5Mode(true)
appModule.config(['$locationProvider', function($locationProvider) {
$locationProvider.html5Mode(true);
}]);
2) 您的HTML中存在<base href="/">
<head>
<base href="/">
...
</head>
参考文献:
Angular不支持这种类型的查询字符串。
URL的查询部分应该是一个以&
分隔的键值对序列,因此可以完美地解释为对象。
没有任何API来管理不表示键值对集合的查询字符串。
var app = angular.module('NGApp', ['ngRoute']); //dependencies : ngRoute
app.config(function ($locationProvider) { //config your locationProvider
$locationProvider.html5Mode(true).hashPrefix('');
});
app.controller('NGCtrl', function ($scope, datasvc, $location) {// inject your location service
//var val = window.location.href.toString().split('=')[1];
var val = $location.search().x1; alert(val);
$scope.xout = function () {
datasvc.out(val)
.then(function (data) {
$scope.x1 = val;
$scope.allMyStuffs = data.all;
});
};
$scope.xout();
});
我的list1.html文件中有:
<head>
<base href=".">
</head>
<body ng-controller="NGCtrl">
<div>A<input ng-model="x1"/><br/><textarea ng-model="allMyStuffs"/></div>
<script src="../js/jquery-2.1.4.min.js"></script>
<script src="../js/jquery-ui.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular-route.js"></script>
<script src="../js/bootstrap.min.js"></script>
<script src="../js/ui-bootstrap-tpls-0.14.3.min.js"></script>
<script src="list1.js"></script>
</body>
我的解决方案更简单,创建一个工厂,并将其实现为一个变量。例如
angular.module('myApp', [])
// This a searchCustom factory. Copy the factory and implement in the controller
.factory("searchCustom", function($http,$log){
return {
valuesParams : function(params){
paramsResult = [];
params = params.replace('(', '').replace(')','').split("&");
for(x in params){
paramsKeyTmp = params[x].split("=");
// Si el parametro esta disponible anexamos al vector paramResult
if (paramsKeyTmp[1] !== '' && paramsKeyTmp[1] !== ' ' &&
paramsKeyTmp[1] !== null){
paramsResult.push(params[x]);
}
}
return paramsResult;
}
}
})
.controller("SearchController", function($scope, $http,$routeParams,$log,searchCustom){
$ctrl = this;
var valueParams = searchCustom.valuesParams($routeParams.value);
valueParams = valueParams.join('&');
$http({
method : "GET",
url: webservice+"q?"+valueParams
}).then( function successCallback(response){
data = response.data;
$scope.cantEncontrados = data.length;
$scope.dataSearch = data;
} , function errorCallback(response){
console.log(response.statusText);
})
})
<html>
<head>
</head>
<body ng-app="myApp">
<div ng-controller="SearchController">
<form action="#" >
<input ng-model="param1"
placeholder="param1" />
<input ng-model="param2"
placeholder="param2"/>
<!-- Implement in the html code
(param1={{param1}}¶m2={{param2}}) -> this is a one variable, the factory searchCustom split and restructure in the array params
-->
<a href="#seach/(param1={{param1}}¶m2={{param2}})">
<buttom ng-click="searchData()" >Busqueda</buttom>
</a>
</form>
</div>
</body>
非常晚的回答 :( 但对于需要的人来说,Angular js也可以使用 :) URLSearchParams 让我们看看如何使用这个新的API从位置获取值!
// 假设 "?post=1234&action=edit"
var urlParams = new URLSearchParams(window.location.search);
console.log(urlParams.has('post')); // true
console.log(urlParams.get('action')); // "edit"
console.log(urlParams.getAll('action')); // ["edit"]
console.log(urlParams.toString()); // "?post=1234&action=edit"
console.log(urlParams.append('active', '1')); // "?
post=1234&action=edit&active=1"
请使用此函数代替URLSearchParams
urlParam = function (name) {
var results = new RegExp('[\?&]' + name + '=([^&#]*)')
.exec(window.location.search);
return (results !== null) ? results[1] || 0 : false;
}
console.log(urlParam('action')); //edit
$location.search()
时,你是正确的,但我想检查一下你调用它时得到的“对象”... - callmekatootie