I have a code snippet that involves receiving a JSON object of type Tenant from an API. I need to separate this object into keys and values within my function called tenantParser(). However, when I try to log displayedValues and displayedKeys, both show an array with a length of 0. I'm unsure of where the issue lies in my code.
import { Component, OnInit } from '@angular/core';
import { ApiServiceService } from 'src/app/Services/api-service.service';
import { Tenant } from 'src/app/class/tenant';
@Component({
selector: 'app-datawrangling',
templateUrl: './datawrangling.component.html',
styleUrls: ['./datawrangling.component.css']
})
export class DatawranglingComponent implements OnInit {
displayedValues:any=[];
displayedKeys:any=[]
tenants!: Tenant[];
tags: any;
constructor(private apiService:ApiServiceService) { }
ngOnInit(): void {
this.apiService.sendGetRequest().subscribe ( data => {
this.tenants = data;
console.log(this.tenants);
});
console.log(this.displayedValues)
}
tenantParser(){
this.tenants.forEach((element:any )=> {
this.displayedValues=Object.keys(element);
this.displayedKeys.push(Object.values(element));
});
this.ngOnInit()
alert(this.displayedData)
}
}