angular1中的路由的$routeParams服务

发布时间：2020-12-17 09:45:40 所属栏目：安全来源：网络整理

导读：.when("/countries/ :idd ",{ templateUrl: "Templates/countryDetail.html", controller: "countryDetailController" }) .controller("countryDetailController",function ($scope,$http,$routeParams) { $http.get("./data.json").then(function (response

.when("/countries/:idd",{

templateUrl: "Templates/countryDetail.html",
controller: "countryDetailController"

})

.controller("countryDetailController",function ($scope,$http,$routeParams) {
$http.get("./data.json").then(function (response) {
$scope.country = response.data[$routeParams.idd];
console.log($scope.country);
console.log(1);
console.log($routeParams.idd+':'+$routeParams);
for (var i in $routeParams) {
console.log( i+':'+$routeParams[i])
};
});

<a href="index.html#/countries/{{$index}}">{{country.Name}}</a>

以上是路由控制器模板。

注意点：

1.$routeParams这个对象打印出来是{

idd : {{$index}}

}

一一对应的键值对。

2.整个路由渲染过程是点击a链接，/countries/{{$index}}，实际是/countries/0，1,2之类，匹配到路由

.when("/countries/:idd），

触发控制器，

$scope.country = response.data[$routeParams.idd];
console.log($scope.country);

取出数据，渲染。

3.ng-repeat的$index 对应于服务$routeParams的value。

4.：idd id xy xyz任意你，但是对应于[$routeParams.idd id xy xyz];得到3，的value值。这样将全局都联系起来。

data如下：

[ { "Id": 1,"Name": "India","Cities": [ { "Id": 1,"Name": "Mumbai","CountryId":1 },{ "Id": 2,"Name": "Delhi",{ "Id": 3,"Name": "Bangalore",{ "Id": 4,"Name": "Chennai",{ "Id": 5,"Name": "Hyderabad","CountryId":1 } ] },{ "Id": 2,"Name": "USA","Cities": [ { "Id": 6,"Name": "New York","CountryId":2 },{ "Id": 7,"Name": "Los Angules",{ "Id": 8,"Name": "Chicago",{ "Id": 9,"Name": "Houston",{ "Id": 10,"Name": "Philadelphia","CountryId":2 } ] },{ "Id": 3,"Name": "UK","Cities": [ { "Id": 11,"Name": "London","CountryId":3 },{ "Id": 12,"Name": "Birmingham",{ "Id": 13,"Name": "Coventry",{ "Id": 14,"Name": "Liverpool",{ "Id": 15,"Name": "Manchester","CountryId":3 } ] } ]

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!