Ionic complex json data extraction


Version:1.0 StartHTML:000000252 EndHTML:000016413 StartFragment:000007884 EndFragment:000016327 StartSelection:000007884 EndSelection:000016323 SourceURL:

I am new to Ionic and I am trying to transfer complex Json data to my html.(Where Ionic comes in handy).

What i mean by ‘complex’ Json data is, Jsons like this:

  "Key: "
       "Key: " "Value",
       "Key: " "Value"
       "Key: " "Value",
       "Key: " "Value"

The problem here for me is the first key. I saw some examples for Json formats without this first key, Examples:

What I have now is:

My .ts file:

import { Component } from '@angular/core';

import{HttpClient} from "@angular/common/http";
import { map } from 'rxjs/operators';

  selector: 'app-tab1',
  templateUrl: '',
  styleUrls: ['']
export class Tab1Page {
  BugList: Object;

  constructor(public http: HttpClient){
    .subscribe(res => this.BugList = res;), 
    (err) => {
      alert("failed loading data");

and for my html:

  <ion-card *ngFor="let bug of BugList| async">

this gives me the following error:

ERROR Error: InvalidPipeArgument: ‘[object Object]’ for pipe ‘AsyncPipe’ Which means that i can only use the *ngFor argument for arrays and not complex Json objects, right?

I also saw another example:

he tried it as follows:

.map(res => res.json())
.subscribe(res => {
  this.users = res.results;
}, (err) => {
  alert("failed loading json data");

this one leaded me in the direction I am now. I replaced .map function with .pipe in my .ts file, because .map is outdated. Now i have a error that says Property ‘results’ does not exist on type 'Object’

Main question is: I really am struggling with this extra key, without it would not be so hard. is there a way i can do this dynamic using the methods shown?

Note: the following question is relevant to my question but is not provided with awnsers: