javascript Angular $routeParams:将查询参数作为数组获取
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/29575858/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Angular $routeParams: get query parameter as array
提问by musa
When I have multiple id
parameters in query, $routeParams.id
gives me an array.
That's great. But, if only one id
is present in the query, I get a string.
当我id
在查询中有多个参数时,$routeParams.id
给我一个数组。那太棒了。但是,如果id
查询中只有一个,我会得到一个字符串。
/?id=12&id=34&id=56 // $routeParams.id = ["12", "34", "56"]
/?id=12 // $routeParams.id = "12"
This is bad. Because in the first case, $routeParams.id[0]
gives "12"
,
while in the second one, it gives "1"
(first char of "12"
).
这不好。因为在第一种情况下,$routeParams.id[0]
给出"12"
,而在第二种情况下,它给出"1"
(第一个字符"12"
)。
I can work this around by inserting an empty id=
to all my links, but this is ugly.
我可以通过id=
在我的所有链接中插入一个空来解决这个问题,但这很难看。
Is "type-checking in controller" my only option? If so, how do I do it?
“在控制器中检查类型”是我唯一的选择吗?如果是这样,我该怎么做?
index.html:
index.html:
<html ng-app="app">
<head>
<script src="//code.angularjs.org/1.3.15/angular.js"></script>
<script src="//code.angularjs.org/1.3.15/angular-route.js"></script>
<script src="script.js"></script>
</head>
<body>
<div ng-view></div>
</body>
</html>
home.html:
home.html:
<a href="#/?id=12">#/?id=12</a><br/>
<a href="#/?id=12&id=34&id=56">#/?id=12&id=34&id=56</a><br/>
<a href="#/?id=12&id=">#/?id=12&id=</a><br/>
<pre>id: {{id | json:0}}</pre>
<pre>id[0]: {{id[0] | json}}</pre>
script.js:
script.js:
angular.module('app', ['ngRoute'])
.config([
'$routeProvider',
function($routeProvider) {
$routeProvider.when('/', {
templateUrl: 'home.html',
controller: 'HomeCtrl'
});
}
])
.controller('HomeCtrl', [
'$scope', '$routeParams',
function($scope, $routeParams) {
$scope.id = $routeParams.id;
}
]);
EDIT:For those who wonder, what I am trying to achive is: inter-controller (or inter-view) communication. User selects some items in one view, and sees details for those selected items in the next view. See in Plunker.
编辑:对于那些想知道的人,我想要实现的是:控制器间(或视图间)通信。用户在一个视图中选择一些项目,并在下一个视图中查看这些选定项目的详细信息。请参阅 Plunker。
回答by codegaze
The best way to do it is not to use id param multiple times but separate your values with another character and always get an array and you are ready to go!
最好的方法是不要多次使用 id 参数,而是将您的值与另一个字符分开并始终获得一个数组,您就可以开始了!
script.js
脚本.js
(function() {
var app = angular.module('app', ['ngRoute']);
app.config([
'$routeProvider',
function($routeProvider) {
$routeProvider.when('/', {
templateUrl: 'home.html',
controller: 'HomeCtrl'
});
}
]);
app.controller('HomeCtrl', [
'$scope', '$routeParams',
function($scope, $routeParams) {
$scope.id = $routeParams.id.split('-');
}
]);
})();
home.html
主页.html
<p>
<a href="#/?id=12-34-56">#/?id=12-34-56</a> Array
</p>
<p>
<a href="#/?id=12">#/?id=12</a> Array
</p>
<pre>id: {{id | json:0}}</pre>
<pre>id[0]: {{id[0] | json}}</pre>
回答by Olatunde Garuba
I wonder why you are passing different values to a single id. However, this should solve your problem
我想知道您为什么将不同的值传递给单个 ID。但是,这应该可以解决您的问题
angular.module('app', ['ngRoute'])
.config([
'$routeProvider', function($routeProvider) {
$routeProvider.when('/', {
templateUrl: 'home.html',
controller: 'HomeCtrl'
});
}
])
.controller('HomeCtrl', [
'$scope', '$routeParams', function($scope, $routeParams) {
$scope.id = angular.fromJson($routeParams.id);
}
]);