You have to process the recieved response in your required format.

      findAllPersons(): Observable<Person[]> {
        return this.httpClient.get<object>('url');
      }
    
    
     findAllPersons().subscribe((response) =>{
        let array = [];
        for(let key in response){
            let p = new Person();
            p.firstName = key;
            p.lastName = response[key];
            array.push(p);
        } 
        console.log(array); // your required array
     });

The interface has an iD field and the json has a date field. They need to be the same types. You also might need to use JSON.parse(stringValue) depending on how you are getting the JSON data.

Use Object.keys and pass them on to Array.prototype.map to create the array that you want - see demo below:

var object={cats1:{Name:"cricket",imgUrl:"some url",list1:{bat:{Name:"bat",imgUrl:"some url",price:"$100"},pads:{displayName:"pads",imgUrl:"some url",price:"$50"}}},cats2:{Name:"football",imgUrl:"some url"}};

var result = Object.keys(object).map(e=>object[e]);

console.log(result);

.as-console-wrapper{top:0;max-height:100%!important;}

EDIT:

Correcting the solution to make list1 an array:

var object={cats1:{Name:"cricket",imgUrl:"some url",list1:{bat:{Name:"bat",imgUrl:"some url",price:"$100"},pads:{displayName:"pads",imgUrl:"some url",price:"$50"}}},cats2:{Name:"football",imgUrl:"some url"}};

var result = Object.keys(object).map(function(e){
  Object.keys(object[e]).forEach(function(k){
     if(typeof object[e][k] == "object") {
       object[e][k] = Object.keys(object[e][k]).map(function(l){
         return object[e][k][l];
       });
     }
  });
  return object[e];
});

console.log(result);

.as-console-wrapper{top:0;max-height:100%!important;}

Use map(t=> t.json()):

return this.http.get(this.heroesUrl)
        .map (t=>t.json())
        .toPromise()
        ...

This is just a hint/suggestion, something you might overlooked. It is hard to understand your question, clarify if this is not what you are looking for.

Maybe for some reason you got "{"y":"1","a":"0"}" back, which is a string. If you need to get a JSON object from it then use JSON.parse(string) function.

If you just want to convert it to Array, you can use JSON.parse()

var result = [];

var in1 = '{"testSuiteID" : 1, "testSuiteName" : "Dummy Name", "timestamp":"1jan2017_8_00_pm", "testsuite_JSONfile" : "IamNewlyGeneratedJSON.json"},{"testSuiteID" : 2, "testSuiteName" : "Dummy Name2", "timestamp":"1jan2017_820_pm", "testsuite_JSONfile" : "IamNewlyGeneratedJSON_2.json"}';

result=JSON.parse("["+in1+"]");

console.log(result);

It should be:

http.get('', { headers: ''})
    .map(response => {
        return response.json().map(d => {
            return new class(d.url);
        });
    });

You can use the .reduce function for this.

It will iterate through an array and allow you to transform it into a single value (in this case an object).

( Bear in mind that in your original array, the validation is a string, not an object )

let arr = [{"name":"ip","children":{"label":"ip","value":"","type":"text","validation":"{ required: true}"}}
,{"name":"test","children":{"label":"test","value":"","type":"text","validation":"{ required: true}"}}
,{"name":"join","children":{"label":"join","value":"","type":"text","validation":"{ required: true}"}}
,{"name":"myform","children":{"label":"myform","value":"","type":"text","validation":"{ required: true}"}}]

// Transform the array
let result = arr.reduce((res, item) => {
  // Add the value into the result object
  res[item.name] = item.children;
  return res;
}, {});

console.log(result);

More details can be found on reduce here

To convert any JSON to array, use the below code:

const usersJson: any[] = Array.of(res.json());

you can use class-transformer which helps you to convert plain javascript objects to real es6 classes. With this real instances you can also use class methods.

import { Component, OnInit } from "@angular/core";
import ProductsJson from "./products.json";
import {plainToClass} from "class-transformer";

@Component({
  selector: "my-app",
  templateUrl: "./app.component.html",
  styleUrls: ["./app.component.css"]
})
export class AppComponent implements OnInit {
  productsJson: any = ProductsJson;
  products: Array<Product>;
  constructor() {}
  ngOnInit() {
    //this.products = <Product[]>this.productsJson;
    this.products = plainToClass(Product, this.productsJson as []);
    console.log(this.products);
  }
}
export class Product {
  id: number;
  name: string;
  description: string;
  relatedProducts: Array<number>;

  getId(){
    return this.id + "_ID";
  }
}

template:

<ul>
    <li *ngFor="let p of products">
        {{p.getId()}} {{p.id}} {{p.name}}
    </li>
</ul>