Angular how to JSON array values into existing scope?

Question

I'm trying to push some JSON data into scope for list whiteout (after tap on load next items btw) to append on the and of the list (Using Ionic framework and infiniteScroll)

Could somebody tell me please, what i'm doing wrong and how to append new list items to the end?

Thanks for any advice.

JSON array example:

  var fakeListData = [
        { "DATE" : testDateTimeFormated,
            "NUMBER_OF_ALL_CALLS" : 25,
            "RESULT_DONE" : 0,
            "RESULT_NOT_INTERESTED" : 0,
            "RESULT_NO_APP" : 0
        },
        { "DATE" : testDateTimeFormated,
            "NUMBER_OF_ALL_CALLS" : 0,
            "RESULT_DONE" : 0,
            "RESULT_NOT_INTERESTED" : 0,
            "RESULT_NO_APP" : 0
        }];

Item filling:

// Option one (throwing Chrome sendrequest error: TypeError: Converting circular structure to JSON)
    $scope.listData.push(fakeListData);

// Option two (crash browser)    
angular.forEach(fakeListData,function(item) {
  $scope.listData.push(item);
});

Check if any of the values in your json refers to the same json. Usually this error is shown in that scenario. — Gilsha, Oct 01 '14 at 12:17
I created new JSON variable with same values and i get following error: Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: listDataItem in listData, Duplicate key: object:01C, Duplicate value: — George Smith, Oct 01 '14 at 12:33

score 1 · Answer 1 · edited Oct 01 '14 at 12:50

1

Try this

$scope.listData=[];

fakeListData.forEach(function(item){
   $scope.listData.push(item);
})

edited Oct 01 '14 at 12:50

Tasos K.

7,979
7
39
63

answered Oct 01 '14 at 12:28

RootHacker

1,109
8
12

score 0 · Answer 2 · edited May 23 '17 at 12:21

We can push more items into existing array, but the syntax should be like this:

// instead of this
// $scope.listData.push(fakeListData);

// we should use this
[].push.apply($scope.listData, fakeListData);

NOTE: Also, important thing to mention with Angular JS.

If we want to clear the array, while keeping the reference to it, we should do it like this

// instead of this, which creates new array/new reference
// $scope.listData = [];

// we should use this, which will keep the reference, but clear its content
$scope.listData.length = 0

This way we can re-fill array during the $scope lifetime and all angular watches will refelect it properly

Check this as well: Short way to replace content of an array

Angular how to JSON array values into existing scope?

2 Answers2