AngularJS: how do i get data into an object and array?

Question

i am trying to get data out of a spreadsheet into an array. I have already stored the data in javascript variables. But now i need those varriables to get stored as an obect in my array. here is my code:

this.json = function(){
        jQuery.getJSON("http://cors.io/?u=https://spreadsheets.google.com/feeds/list/1l4XTKaLZihj5WDRuZJE5Y7RQ7Cr7SD_-tH0ctwhizWc/od6/public/values?alt=json").success(function(data) {
            console.log(data.feed.entry);
            //try
            for (var i = 0; i < data.feed.entry.length; i++) {

                var id = data.feed.entry[i].gsx$id.$t;
                var name = data.feed.entry[i].gsx$name.$t;
                var price = data.feed.entry[i].gsx$price.$t;
                var notcompatiblewith =     data.feed.entry[i].gsx$notcompatiblewith.$t;

                this.parts[i] = {"id": id, "name": name, "price": price, "comp": notcompatiblewith, "canAdd": true, "added": false};    
            };
        });
    };

i call the function this.json in my html with ng-init="myctrl.json()" and it calls it perfectly. in my console on inspect element i get the error: 'Uncaught TypeError: Cannot set property '0' of undefined'

my array should look like this if it is initialised well:

{
id: 1,
name: 'vitamine A',
price: 3,
canAdd: true,
added: false,
comp: [2, 5]
},
{
id: 2,
name: 'vitamine B',
price: 5,
canAdd: true,
added: false,
comp: [1, 3]
},
{
id: 3,
name: 'vitamine C',
price: 2,
canAdd: true,
added: false,
comp: [2]
},
{
id: 4,
name: 'Opium',
price: 20.95,
canAdd: true,
added: false,
comp: []
},
{
id: 5,
name: 'steroids',
price: 12.5,
canAdd: true,
added: false,
comp: [1]
}

edit: the array parts in initialised under my controller like this

var parts = [];

and is declared in my controller as

this.parts = parts;

Saar Kuriel · Accepted Answer · 2016-03-23 11:18:27Z

1

When you call this it refers to jQuery. Therefor parts does not exist.

Also, you're doing it wrong. You should use a service for it, and in the service there's a angular's $http for handling ajax requests.

In your way you're not using angular correctly.

Read here: https://docs.angularjs.org/guide/services

answered Mar 23, 2016 at 11:18

Saar Kuriel

5824 silver badges16 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Bob Sponge · Accepted Answer · 2016-03-23 11:17:05Z

You need to initialize this.parts variable with empty Array object:

this.json = function(){
    jQuery.getJSON("http://cors.io/?u=https://spreadsheets.google.com/feeds/list/1l4XTKaLZihj5WDRuZJE5Y7RQ7Cr7SD_-tH0ctwhizWc/od6/public/values?alt=json").success(function(data) {
        console.log(data.feed.entry);
        this.parts = []; // <-- this line was added
        // skipped
    });
};

Also you can use push method of Array instead of this.parts[i] = ...:

this.parts.push({"id": id, ... });

Ved · Accepted Answer · 2016-03-23 11:25:27Z

0

Have you tried :

this.parts[i].push({"id": id, "name": name, "price": price, "comp": notcompatiblewith, "canAdd": true, "added": false});

Because :

this.parts[i] = {"id": id, "name": name, "price": price, "comp": notcompatiblewith, "canAdd": true, "added": false};

This will end up assigning only one value to array.Everytime array will get upadated of latest value and deleting previous value.

edited Mar 23, 2016 at 11:25

answered Mar 23, 2016 at 11:18

Ved

12.1k5 gold badges46 silver badges61 bronze badges

1 Comment

Bram Willems Over a year ago

yes, the first comment told me to do it that way, but i left out the [i] and it worked just fine

Collectives™ on Stack Overflow

AngularJS: how do i get data into an object and array?

3 Answers 3

Comments

Comments

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

1 Comment

Related