#Angular returning but not returning array of objects from rest API call

35 messages · Page 1 of 1 (latest)

hearty lily
#

I am making an rest api to a java backend with angular. When making the call it returns an array of Users. These users also have an array of certifications as well. When I console.log() one of the users to test it, it shows the array of certifications in json within the inspect of chrome. When I try to log just 1 of the certifications it doesn't show. It also does not show on the page either. Could this possibly be because of some kind of lazy loading?

This code snippet shows an empty array of certifications in chrome

loadUsers() {
    this.userServ.getUsers().subscribe(
      (users) => {
        this.users = users;
        this.viewUsers = this.users.map((x) => x);
        console.log(this.viewUsers[0].certifications);
      },
      (noUsers) => {
        console.log('Error gettings users from service');
        console.log(noUsers);
      }
    );
  }

While this code snippet will show both certifications attached to viewUsers[0] once expanded in the chrome inspect.

loadUsers() {
    this.userServ.getUsers().subscribe(
      (users) => {
        this.users = users;
        this.viewUsers = this.users.map((x) => x);
        console.log(this.viewUsers[0]);
      },
      (noUsers) => {
        console.log('Error gettings users from service');
        console.log(noUsers);
      }
    );
  }
jovial shard
#

And mind the map part here is useless this.users.map((x) => x);

hearty lily
#

when trying to log them

#

undefined with no index

jovial shard
hearty lily
jovial shard
# hearty lily

check your screenshot: your back is sending misleading data.

#

it's called certification there, not certifications

#

If that's an array, the back should send it as certifications

hearty lily
#

it's called certifications on the model side. When it says certification I believe it's referencing it's data type here. I think so anyway

#

yea that property doesn't exist.

jovial shard
#

You need to update (or ask for update) on backend side.

hearty lily
#

it is, but this is an array of certifications

jovial shard
hearty lily
#

yea

#

that's what I meant, it's an array of certification

jovial shard
# hearty lily

Typescript is about developer experience:

If you order a blue car but get a yellow bike, you still get a yellow bike.

#

Typescript won't fix the name of the properties received from the backend

hearty lily
#

ahh

#

i see what you mean

jovial shard
# hearty lily

here it's called certification so that's the source of truth. Typescript can only help with the code you are writing in your app. The data is not from your app but from an external source

hearty lily
#

i should have just named this certifications

jovial shard
hearty lily
#

and we're gucci

#

im gucci, I got them printing

#

thanks a ton, I'd have never figured this out I don't think

#

I also apologize if I sounded rude, that was not my intention. Now that I'm looking back at it I kinda sounded rude. sorry brotha

jovial shard