angular1中的路由的$routeParams服务

 .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",
        "CountryId":1
      },
      {
        "Id": 3,
        "Name": "Bangalore",
        "CountryId":1
      },
      {
        "Id": 4,
        "Name": "Chennai",
        "CountryId":1
      },
      {
        "Id": 5,
        "Name": "Hyderabad",
        "CountryId":1
      }
    ]
  },
  {
    "Id": 2,
    "Name": "USA",
    "Cities": [
      {
        "Id": 6,
        "Name": "New York",
        "CountryId":2
      },
      {
        "Id": 7,
        "Name": "Los Angules",
        "CountryId":2
      },
      {
        "Id": 8,
        "Name": "Chicago",
        "CountryId":2
      },
      {
        "Id": 9,
        "Name": "Houston",
        "CountryId":2
      },
      {
        "Id": 10,
        "Name": "Philadelphia",
        "CountryId":2
      }
    ]
  },
  {
    "Id": 3,
    "Name": "UK",
    "Cities": [
      {
        "Id": 11,
        "Name": "London",
        "CountryId":3
      },
      {
        "Id": 12,
        "Name": "Birmingham",
        "CountryId":3
      },
      {
        "Id": 13,
        "Name": "Coventry",
        "CountryId":3
      },
      {
        "Id": 14,
        "Name": "Liverpool",
        "CountryId":3
      },
      {
        "Id": 15,
        "Name": "Manchester",
        "CountryId":3
      }
    ]
  }
]


你可能感兴趣的:(angular1中的路由的$routeParams服务)