Angular 6 cannot get item from array

Question

I am building app which shows amazon products :

showProducts(){
    this.search.getProducts().subscribe
    ((data: any) => {
        this.list = data['hydra:member'];
        this.prices = data.lowestPrices.Amazon.newItem;
        console.log('Objects', this.list);
        console.log('Prices', this.prices);
    });

}

this.list in console :

this.prices in console :

Cannot read property 'Amazon' of undefined

How to get lowest prices of Amazon properly ?

Isn't that an `Array`? go the index first and then retrieve the prop — Ashish Ranjan, Dec 04 '18 at 08:47
Like: `data`[0].lowestPrices.Amazon.newItem;` but now this would depened which index you want to access — Ashish Ranjan, Dec 04 '18 at 08:48
@Angulandy2 So you want `this.prices` to be an array of all lowest prices? — Ashish Ranjan, Dec 04 '18 at 08:49
I want to get all lowestPrices of all products - that means with FR value. — Angulandy2, Dec 04 '18 at 08:50
@Angulandy2: I understand that, how you want to store it? is `this.prices` an array of all lowest prices? — Ashish Ranjan, Dec 04 '18 at 08:51
Yes i want that + country that means I need to store FR, IT , EN too as you see. — Angulandy2, Dec 04 '18 at 08:52
`data['hydra:member'][index].Amazon.newItem` is not a number but an object having `FR` property containing a price in euro. Since other data is not shown there maybe a newItem instance having `EN` and `GBP` property that has a different value than Euro. Without knowing the possible data there is no way to know the lowest price. — HMR, Dec 04 '18 at 08:52
@Angulandy2 Tell me, `this.list = data['hydra:member'];` works for you? — Ashish Ranjan, Dec 04 '18 at 08:54
`can't get Amazon of undefined` means that data does not have a `lowestPrices` property but since you didn't post data or a sample of it there is no way of knowing if you may have misspelled the property name. — HMR, Dec 04 '18 at 08:57

Nikolai Kiefer · Answer 1 · 2018-12-04T08:57:16.447

2

You're accessing an array []. Arrays have indexes [0]->[n]

In your example it would be

showProducts(){
 this.search.getProducts().subscribe
 ((data: any) => {
  this.list = data['hydra:member'];
  this.prices = data['hydra:member'][0].lowestPrices.Amazon.newItem;
  console.log('Objects', this.list);
  console.log('Prices', this.prices);
});

for the first item.

You'll have to write a loop for each item of data for every information

edited Dec 04 '18 at 08:57

answered Dec 04 '18 at 08:52

Nikolai Kiefer

568
5
15

Cannot get newItem of undefined. – Angulandy2 Dec 04 '18 at 08:53
I used it : data['hydra:member'].Amazon.newItem; – Angulandy2 Dec 04 '18 at 08:55
1

this.prices = data['hydra:member'][0].lowestPrices.Amazon.newItem; worked for me – Angulandy2 Dec 04 '18 at 08:56
How you are accessing it in html file?? – chethu Dec 04 '18 at 08:57

score 1 · Accepted Answer · answered Dec 04 '18 at 08:57

1

Use Array map, to iterate over the array and populate your properties For Example:

this.prices = data['hydra:member'].map(elem => elem.lowestPrices.Amazon.newItem;);

answered Dec 04 '18 at 08:57

Ashish Ranjan

12,760
5
27
51

which is better - for(i) or .map ? – Angulandy2 Dec 04 '18 at 09:06
Saves space is the only better thing I would say then – Angulandy2 Dec 04 '18 at 09:10
@Angulandy2 I am sorry just read this: https://hackernoon.com/javascript-performance-test-for-vs-for-each-vs-map-reduce-filter-find-32c1113f19d7 – Ashish Ranjan Dec 04 '18 at 09:11
@Angulandy2: You can even see this: https://github.com/dg92/Performance-Analysis-JS It seems the performance of a `for loop` and a `map` dependes upon the data size we are iterating over – Ashish Ranjan Dec 04 '18 at 09:14

Angular 6 cannot get item from array

2 Answers2