web-dev-qa-db-fra.com

Comment ajouter Angular forEach chaque élément d'un tableau

Ici, j'aime expliquer clairement mon problème.

$http.get('arealist.json').success(function(response){
      angular.forEach(response, function(data){
           $scope.arealist = data.area_name;
           console.log($scope.arealist);
      });
});

En utilisant le code ci-dessus, j'obtiens area_name auprès de arealist.json. Et il ressemble à l'image ci-dessous dans l'image de la console.  console.log image

mais j'ai besoin du magasin ci-dessus des données dans un tableau et il ressemble à ci-dessous

$scope.arealist = [ 
                    "Avadi", 
                    "Poonamallee",
                    "Padi", 
                    "Ambattur Industrial Estat",
                    "Annanagar",
                    "Arumbakkam",
                    "Kodambakkam",
                    "Nandanam"
                  ]

Comment puis-je faire ceci ?

arraysangularjs
5
Nodemon

Déclarez une variable comme ci-dessous.

var arealistArray=[];
$scope.arealist=[];

Puis poussez une valeur dans un tableau.

angular.forEach(response, function(data){
       arealistArray.Push(data.area_name);
  });

Enfin, affectez le tableau à la variable scope.

$scope.arealist=arealistArray;
3
Thangadurai

Il semble que vous exécutiez cette demande dans un contrôleur (puisque $scope est disponible)? Donc, tout d’abord, vous devriez faire de telles demandes dans un service. Par exemple:

angular
    .module(/*module name*/)
    .service('AreaService', function ($http) {

        // Map the array of area objects to an array
        // of each area object's `area_name` property
        this.getAreas = function () {
            return $http
                .get('arealist.json')
                .then(function (response) {
                    return response.data.map(function (data) {
                        return data.area_name;
                    });
                });
        };
    })

Et puis utilisez le service dans votre contrôleur:

    .controller(/*controller name*/, function (AreaService) {
        AreaService.getAreas().then(function (areas) {
            $scope.arealist = areas;
        }); 
    });
1
sdgluck

Utilisez un tableau:

$scope.arealist = [];
$http.get('arealist.json').success(function(response){
      angular.forEach(response, function(data){
           $scope.arealist.Push(data.area_name);
           console.log($scope.arealist);
      });
});
1
Tarun Dugar

Vous pouvez utiliser Array.prototype.map () pour y parvenir. 

$scope.arealist = [];

$http.get('arealist.json').success(function (response) {
    $scope.arealist = response.map(function (data) {
        return data.area_name;
    });
});

Support du navigateur pour la carte.

Si vous utilisez des bibliothèques telles que underscore.js ou lodash , utilisez _.map () pour le même résultat.

$scope.arealist = [];

$http.get('arealist.json').success(function (response) {
    $scope.arealist = _.map(response, function (data) {
        return data.area_name;
    });
});
0
Prashant