How to pass array inside method while using the map in javascript?
<ul class="details">
${
speedRecords.map(speed => `<li>${speed.name}<span>
<a href="javascript:void(0)" onclick="showModalWithTopic(${speed.name} , ${speed.topics} )">${speed.total}</a></span></li>`)
.join('')
}
</ul>
speedRecords=[
{
total: 6
name: "Wolks"
topics: [
{
property1 : "one",
property2 : "two"
},
{
property1 : "55",
property2 : "66"
},
{
property1 : "11",
property2 : "22"
]
},
{
total: 5
name: "Honda"
topics: [
{
property1 : "one",
property2 : "two"
},
{
property1 : "55",
property2 : "66"
},
{
property1 : "11",
property2 : "22"
]
}
]
The line function showModalWithTopic(name, topics){} does do some other operation but topics always return to me as Object object.
When I look at this showModalWithTopic(${speed.name} , ${speed.topics}) method parameter is not created in proper way because it contains ('Honda' , [object Object],[object Object],[object Object] )
Do you wanna do something like this :
speedRecords= [{
total: 5,
name: "Honda",
topics: [{
property1 : "one",
property2 : "two"
}, {
property1 : "55",
property2 : "66"
}, {
property1 : "11",
property2 : "22"
}]
}];
document.getElementById('displayElement').innerHTML = speedRecords.map(speed => `<li>
${speed.name}
<span>
<a href="javascript:void(0)"
onclick="showModalWithTopic(${speed.name} , ${speed.topics})">
${speed.total}
</a>
</span></li>`);
<ul class="details">
<div id="displayElement"></div>
</ul>