Here is the interface structure I am working with:
export interface ObjLookup {
owner?: IObjOwner;
contacts?: IOwnerContacts[];
location?: IOwnerLocation;
}
This includes the following interfaces as well:
export interface IObjOwner {
lastName?: string,
firstName?: string;
}
export interface IOwnerContacts {
name?: string;
address?: string;
email?: string;
}
export interface IOwnerLocation {
address?: string;
city?: string;
state?: string;
zip?: number;
country?: string;
}
Describing my response object structure, it looks like this:
{
status: "success",
is_error: false,
errors: [],
data: {
owner: {
lastName: "lovejoy",
firstName: "reverend"
},
contacts: [
{
name: "homer simpson",
address: "3 evergreen terrace, springfield, XX XX823",
email: "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="5d353230382f1d2e2d2f34333a3b3438313933283e31383c2f73">[email protected]</a>"
},
{
name: "ned flanders",
address: "5 evergreen terrace, springfield, XX XX823",
email: "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="0a646f6e4a7965676f69627f786962246d656e">[email protected]</a>"
}
],
location: {
address: "the church",
city: "Springfield",
state: "XX",
zip: XX823,
country: "US"
}
}
}
There might be some syntax errors in the json response due to manual typing.
In order to handle this response efficiently, I believe using observables and mapping techniques are necessary. Here is a snippet of what I have so far:
export class SimpsonsService {
public resourceUrl = 'www.example.com/api/simpsons';
constructor ( protected http: HttpClient) {}
find(name: string): Observable<EntityResponseType> {
return this.http.get<ObjLookup>(`${this.resourceUrl}/${name}`)
.pipe(
map(respObj => {
const
})
);
});
}
}
I've attempted different approaches to extract the relevant data objects from the response and align them with their respective interfaces within ObjLookup.
How can I correctly parse and utilize the response.data.owner, response.data.contacts, and response.data.location objects?