CODEWITHSUNDEEP
javascriptangularjsionic-framework
user2413453
user2413453

Reputation:

Angularjs using forEach

I am trying to iterate through data from a web Service in my angularjs project. The issue I am having is:

In my console log it shows each item with their info but as soon as I try to show it on my html it only shows the last item of al the data?

HTML

<ion-item ng-repeat="item in documents">{{item}}</ion-item>

if I add id to item like this:

<ion-item ng-repeat="item in documents">{{item.id}}</ion-item>

it only shows blank spaces in the same amount as the data. Which I think says the data is there, but there is just not any string value showing.

JS

.controller('DashCtrl', function($scope, $http) {
    $http.get("http://localhost:15021/Service1.svc/getAllTrucks")
            .success(function(data) {

                var obj = data;
                var ar = [];

                angular.forEach(obj, function(index, element) {

                    angular.forEach(index, function(indexN, elementN) {
                        ar = {id: indexN.QuoteID, quotenum: indexN.QuoteNumber};

                        console.log(ar);
                    });

                    $scope.documents = ar;

                });

                console.log(data);
            })
            .error(function(data) {
                console.log("failure");
            });

What I am trying to accomplish is to populate the app with a list of data. Thank You. (if something doesn't make any sense please ask)

Upvotes: 1

Views: 2473

Answers (2)

harksin
harksin

Reputation: 235

you can try it : 

.success(function(data) {
    var obj = data;
    $scope.documents  = [];

    angular.forEach(obj, function(index, element) {

        angular.forEach(index, function(indexN, elementN) {
            $scope.documents.push( {id: indexN.QuoteID, quotenum: indexN.QuoteNumber});

            console.log($scope.documents);
        });

    });

    console.log(data);
})

Upvotes: 0

David L
David L

Reputation: 33873

You are not actually adding each record to the array, you are only assigning the iterated item to the array. As a result, the only thing you see is the last record. You can add .push() to add each iterated record to the end of your array.

 var ar = [];

 angular.forEach(obj, function(index, element) {
     angular.forEach(index, function(indexN, elementN) {
         ar.push({id: indexN.QuoteID, quotenum: indexN.QuoteNumber});
     });
 });

 $scope.documents = ar;

In addition, you should assign ar at the end of your nested iterations.

Upvotes: 6

Related Questions