I think this probably has a simple solution but I've been trying for hours and I can't figure it out. I have an array with objects that have properties:
I'm trying to output each address in it's own div, like:
But every solution I come up with ends up outputting BOTH addressLine1's after one another, then both cities after one another, then both countries after one another, like:
I've tried using forEach, like:
but this won't even output to the DOM because the entire thing shows as an error in VSCode. Also, I'm using typescript but I figured I'd try out this forum. Any one know how to do this?
Code:
contactInfo = {
addresses: [
{
addressLine1: "32030 Ortiz Fords"
city: "Port Devon"
country: "Guadeloupe"
addressType: "BUSINESS"
},
{
addressLine1: "333 High Street"
city: "New York"
country: "USA"
addressType: "PERSONAL"
}]
}I'm trying to output each address in it's own div, like:
Code:
<div>
Business Address:
32030 Ortiz Fords
Port Devon
Guadeloupe
<div/>
<div>
Personal Address:
333 High Street
New York
USA
<div/>But every solution I come up with ends up outputting BOTH addressLine1's after one another, then both cities after one another, then both countries after one another, like:
Code:
const allAddresses = primaryContact.address.map((address) => ({
address,
}));
{allAddresses
.map((address) => address)
.map((address) => {
return (
<div key={address.address.id}>
{address.address.addressLine1}
{address.address.city}
{address.address.country}
</div>
);
})}I've tried using forEach, like:
Code:
{allPrimaryAddress.map((address) => {address.address}).forEach((address)=> {
return (
{address.address.addressLine1}
{address.address.city}
{address.address.city}
)
))}but this won't even output to the DOM because the entire thing shows as an error in VSCode. Also, I'm using typescript but I figured I'd try out this forum. Any one know how to do this?
