From a webService, I would like to display some data. For example: LABEL, ISINCODE, REF.

In JSON, the structure is presented like this:

MET = [
  {
    LABEL: "WILHELMSEN",
    ISINCODE: "NO0010571698",

    RESOLUTION: [
      {
        REF: "01",
      },
    ],

  },

];

The method that will retrieve the data is called getData().

export class ShareholderInformationDetailsComponent implements OnInit {

    private unsubscribe$ = new Subject < void > ();

    arrayMets: ArrayMet[] = [];

    constructor(private service: ShareholderInformationDetailsService) {}


    ngOnInit(): void {
        this.getData();
    }

    getData(): void {
        this.service.getShareholdersDetails().pipe(
            takeUntil(this.unsubscribe$)
        ).subscribe(res => {
            if (res.RETURNCODE === ApiResponseCodeEnum.Ok) {
                console.log("First console ");
                console.log(JSON.stringify(res));
                console.log("---------------");
                console.log("Second console ");
                this.arrayMets = res.ARRAY_MET;
                console.log(JSON.stringify(this.arrayMets))
            }
        });
    }


}

In the first console.log I wanted to check if the webService was communicating with the front-end. I get data.

However, I don’t understand why I don’t see anything in the second console.log?

I get an undefined error message…

In InformationResponse file, I don’t see what I typed wrong?

export interface InformationResponse extends ApiResponse {
    ARRAY_MET: ArrayMet[];
}

export interface ArrayMet {
    LABEL: string;
    ISINCODE: string;
    RESOLUTION: RESOLUTION[];
}; 

export interface RESOLUTION {
    REF: number; 
}

Thanks

>Solution :

There is no ARRAY_MET but a MET key in your object; Your interface is wrong.