can't get data form array

Question

I try to get data from the array but I get undefined

please check the image of my problem

I don't know what I'm missing

please help

I have an array called nameTable of string

when I console.log(this.nameTable) I got this : check the image please

enter image description here

and when I click to arrow I got this : check image please

enter image description here

the problem is the table has 5 element I want to show them so I make for loop to do that

for (let i = 0; i < 5; i++){
        console.log(this.nameTable[i])
        }

but us you can see in the image I got undefined

enter image description here

here the code :

employeeL:Array<Awinjard> = [];
  inv_agentTab: Array<Inv_agent> = [];
  drafbiesTab: Array<Drafbies> = [];
  nameemployee: string = "";
  inv_agentNombre: number = 0;
  matriculeTable: Array<number> = [];
  nameTable:Array<string> = [];
  validatationTable: Array<number> = [];

  ngOnInit() {
    this.folder = this.activatedRoute.snapshot.paramMap.get('id');
  
    this.awinjard.getAwinjardMatricule().subscribe(res => {
      this.inv_agentTab = res as Array<Inv_agent>
      this.inv_agentTab.forEach(element => {
        this.matriculeTable[this.inv_agentNombre] = element.AGENT;
        this.validatationTable[this.inv_agentNombre] = element.VLD;
        this.inv_agentNombre++;
      
        this.awinjard.getAwinjardNameAr().subscribe(res2 => {
          this.drafbiesTab = res2 as Array<Drafbies>
          this.drafbiesTab=this.drafbiesTab.filter((employee)=>employee.DECAFFE==element.AGENT)
          this.nameemployee = this.drafbiesTab[0].AR_DELAFFE;
          
          this.nameTable.push(this.nameemployee);
        
        })
      });
      
      for (let i = 0; i < 5; i++){
      // here the problem I can't get the data form nameTable array
        console.log(this.nameTable[i])
        let awin= <Awinjard> {
          matricule: this.matriculeTable[i],
          fullname: this.nameTable[i],
          status: true,
          done: 1,
          mustBeDone:40
        }
        this.employeeL.push(awin);
      }
    })
  }

It is difficult to predict what's going wrong here without seeing your actual array. Could you please post how you are adding values to your array ? — AkshAy Agrawal, Mar 31 '21 at 17:17
what is nameTable? error is saying it's not an array or empty array — Nonik, Mar 31 '21 at 17:24
there is no error but i can't get data form the array and when I click into then `[ ]` I can get the data , I add the code please check it — youssef1151, Mar 31 '21 at 17:27
You are trying to loop over it before it is populated in the `subscribe()`. See also [Weird behavior with objects & console.log](https://stackoverflow.com/questions/23429203/weird-behavior-with-objects-console-log) to understand why you see what you see when you expand the array — charlietfl, Mar 31 '21 at 17:30
when I loop it out of the `subscribe()` the loop will be executed before I get data form the database — youssef1151, Mar 31 '21 at 17:31
Move the `for` loop code into the subscribe after the loop there — charlietfl, Mar 31 '21 at 17:32
how? you mean let the loop out the subscribe()? if I let it out I can't get the data because the loop will be executed before getting the data — youssef1151, Mar 31 '21 at 17:35
No. Other way around...move the `for` loop into subscribe after the `forEach` — charlietfl, Mar 31 '21 at 17:44

Raishav Hanspal · Answer 1 · 2021-03-31T17:56:35.987

You can move the code where you're logging nameTable[] inside the subscribe (where you are pushing the values into nameTable[]).

A complete solution is to use complete in subscribe() -->

  this.awinjard.getAwinjardNameAr().subscribe(res2 => {
          this.drafbiesTab = res2 as Array<Drafbies>
          this.drafbiesTab=this.drafbiesTab.filter((employee)=>employee.DECAFFE==element.AGENT)
          this.nameemployee = this.drafbiesTab[0].AR_DELAFFE;
          
          this.nameTable.push(this.nameemployee);
        
        },err => {console.log(err)}, ()=> {
      for (let i = 0; i < 5; i++){
      // here the problem I can't get the data form nameTable array
        console.log(this.nameTable[i])}})
      });

You can read more on https://angular.io/guide/observables

the problem of this solution that the code looped 5 time – youssef1151 Mar 31 '21 at 18:14 — youssef1151, Mar 31 '21 at 18:14

score 1 · Accepted Answer · answered Mar 31 '21 at 17:51

You have subscribed to getAwinjardNameAr and before that response, you are trying to access the nameTable array, which is why you get undefined. @raishav-hanspal's solution is right to solve your issue, but a code change can keep things straightforward. I suggest you to write that code inside your for loop inside your subscribe. Here's the alteration:

this.awinjard.getAwinjardNameAr().subscribe(res2 => {
          this.drafbiesTab = res2 as Array<Drafbies>
      this.drafbiesTab=this.drafbiesTab.filter((employee)=>employee.DECAFFE==element.AGENT)
          this.nameemployee = this.drafbiesTab[0].AR_DELAFFE;
          this.nameTable.push(this.nameemployee);
          let awin= <Awinjard> {
          matricule: this.matriculeTable[this.inv_agentNombre],
          fullname: this.nameemployee,
          status: true,
          done: 1,
          mustBeDone:40
        }
        this.employeeL.push(awin);
        })

thank you friend it's work now perfectly tank you one more time that mean a lot to me — youssef1151, Mar 31 '21 at 18:22

can't get data form array

2 Answers2