I'm currently working on a project, and my main concern is: how do I access the response from the first array when all arrays have identical attribute names like body? similar to this: console.log and screen
Everything works fine on a simple JSON server.
I need to list the batches in this array to display the results on this screen:
I've tried almost everything, but no luck;
- Using the index search function;
- Filtering the array using the filter function;
- Mapping the array using the map function.
But perhaps I am approaching this incorrectly? here's the service that needs to be fetched:
import { Injectable, OnInit } from '@angular/core';
import {HttpClient, HttpParams} from '@angular/common/http';
import { Observable } from 'rxjs';
@Injectable({
providedIn: 'root'
})
export class LotesService implements OnInit{
readonly apiURL = `http://localhost:3000`;
readonly lotesURL = 'item';
readonly registrosURL = 'registros';
readonly termId = '?id=';
readonly mode = mode.CONTINUABLE;
readonly size = 2000;
readonly elements = 2000;
readonly continuable = 'ODEwODE3ODQwMDMwMTIyMDQ3';
readonly selector = Selector;
constructor(private httpClient: HttpClient) {
}
//Function to Fetch Batches on Lotes API - Listar Lotes
getLotes(situacao: situacao.ATIVO){
let params = new HttpParams()
.set('situacao', situacao);
return this.httpClient.get<any[]>(`${this.apiURL}/${this.lotesURL}/`,{params: params});
}
export enum situacao {
ATIVO = "ATIVO",
INATIVO = "INATIVO",
REMOVIDO = "REMOVIDO",
}
and here's the batch component:
import { Lote, situacao} from 'src/app/services/lotes.service';
import { Component, OnInit, ChangeDetectorRef} from '@angular/core';
import { Injectable } from '@angular/core';
import { environment } from './../../../environments/environment';
import { HeaderService } from 'src/app/services/header-service.service';
import { LotesService } from 'src/app/services/lotes.service';
import { PageEvent } from '@angular/material/paginator';
@Component({
selector: 'app-lotes',
templateUrl: './lotes.component.html',
styleUrls: ['./lotes.component.css'],
})
//status 200 always
@Injectable({
providedIn: 'root'
})
export class LotesComponent implements OnInit {
MostrarColunas: string[] = ['id', 'dataProcessamento', 'quantidadeClientes', "quantidadeParcelas", "situacao"];
lotes: Lote[] = [];
dataSource = this.lotes;
public pageslice = this.lotes.slice(0, 5);
pageSize = 3;
pageIndex = 0;
pageSizeOptions = [3, 6, 9];
showFirstLastButtons = true;
handlePageEvent(event: PageEvent) {
const startIndex = event.pageIndex * event.pageSize;
let endIndex = startIndex + event.pageSize;
if (endIndex > this.lotes.length) {
endIndex = this.lotes.length;
}
this.pageslice = this.lotes.slice(startIndex, endIndex);
this.pageSize = event.pageSize;
this.pageIndex = event.pageIndex;
}
constructor(private loteService: LotesService,
private headerService: HeaderService,
private changeDetectorRef: ChangeDetectorRef) {
this.lotes = [];
}
ngOnInit() {
this.headerService.setTitle('Lotes');
this.BuscaLotes();
this.changeDetectorRef.detectChanges();
}
BuscaLotes() {
this.loteService.getLotes(situacion.ATIVO).subscribe(
data => {
this.lotes = data;
console.log(this.lotes);
},
error => console.log(error)
);
}
}
my object:
export class Lote {
constructor(
public id: any,
public dataProcessamento: Date | "dd/MM/yyyy",
public quantidadeClientes: number,
public quantidadeParcelas: number,
public situacao: situacao
) {}
}
My query is: How can I extract the Json data to only display the body attribute?
json data:
"item": [
{
"name": "lotes - Listar lotes",
"request": {
"method": "GET",
"header": [
{
"key": "Authorization",
"value": "Basic dGl2ZWE6UzRjTDdmUDl0RW1nYkNnTmxJRnBsekpBSlV5UGpVQjZkcUVKV2tnNDVYMGkw"
},
{
"key": "Content-Type",
"name": "Content-Type",
"value": "application/json",
"type": "text"
}
],
"url": {
"raw": "https://{{HOST}}/api/assessorias/lotes",
"protocol": "https",
...
maybe I'm overlooking something?
thank you in advance, and go easy on me! it's my first post here