Récupérer des informations spécifiques à partir du fichier JSON dans AngularJS en utilisant les contrôleurs et routeParams

Question

Je possède ce fichier JSON

[{ 
     "name": "China", 
     "continent": "Asia", 
     "id": 1 
     }, 
     { 
     "name": "UK", 
     "continent": "Europe", 
     "id": 2 
     }, 
     { 
     "name": "Germany", 
     "continent": "Europe", 
     "id": 3 
     }] 

Et j'ai ces deux contrôleurs:

countryApp.controller('CountryListCtrl', function($scope, countries) { 
      countries.list(function(countries) { 
       $scope.countries = countries; 
      }); 
     }); 

     countryApp.controller('CountriesDetailCtrl', function($scope, $routeParams, countries) { 
      countries.find($routeParams.countryId, function(country) { 
       $scope.country = country; 
      }); 
     }); 

Je suis en train de revenir seulement l'information des pays qui sont situés en Europe, donc j'ai écrit ce contrôleur:

countryApp.controller('ContinentCtrl', function($scope, countries) { 
      countries.list(function(countries) { 
       if (country.continent = "Europe") { 
        $scope.country = country; 
       } 
      }); 
     }); 

Cependant, je suis pas tout à fait sûr comment le retourner et afficher en utilisant le routeProvider et je ne suis pas vraiment l'explication donnée par la documentation. Quelqu'un peut-il expliquer comment cela serait fait pour moi?

Pour retourner toute la liste que je fais:

countryApp.config(function($routeProvider) { 
      $routeProvider. 
      when('/', { 
       templateUrl: 'country-list.html', 
       controller: 'CountryListCtrl' 
      }). 
      when('/Europe', { 
       templateUrl: 'country-list.html', 
       controller: 'ContinentCtrl' 
      }); 
}); 

Answer 1

vous pouvez faire comme,

countryApp.controller('ContinentCtrl', function($scope, countries, $routeParams) { 
     countries.list(function(countries) { 
      for (var i=0; i < countries.length; i++) { 
       if (countries[i].continent == $routeParams.continent) { 
        $scope.countries.push (countries[i]); 
       } 
      } 
     }); 
    }); 

et dans votre fichier de routage,

countryApp.config(function($routeProvider) { 
     $routeProvider. 
     when('/', { 
      templateUrl: 'country-list.html', 
      controller: 'CountryListCtrl' 
     }). 
     when('continents/:continent', { 
      templateUrl: 'country-list.html', 
      controller: 'ContinentCtrl' 
     }); 
}); 

Answer 2

Vous pouvez écrire de cette façon aussi simple javascript plaine.

countryApp.controller('ContinentCtrl', function ($scope, countries) { 
     var europeanCountries = []; 
     for (var i = 0; i < countries.length; i++) { 

      if (countries[i].continent === "Europe") { 

       europeanCountries.push(countries[i]); 

      } 
     } 
    });