Svelte iterate over array of comma separated key values-CodePudding

I am having an array of comma separated objects like... new_data = [ Max:500 , Ron:200 ],I want to iterate over the array giving a list as Max-500 and Ron 200 In html it would look like

Max-500

Ron-200

Can I get a solution using {#each} tag in svelte? I tried {#each new_data as data}

{data}

{/each}

CodePudding user response：

You can map your array:

let new_data = ['Max:500', 'Ron:200'].map(item => item.split(':'))

Then use #each like:

<ul>
{#each new_data as data}
    <li>{data[0]}-{data[1]}</li>
{/each} 
</ul>

Working example: https://svelte.dev/repl/ba06eae1002345118bc3b645edb7049a?version=3.46.4

CodePudding user response：

Or like this

<script>
    let new_data = ['Max:500', 'Ron:200']
</script>

<ul>
{#each new_data as data}
    <li>{data.replace(':','-')}</li>
{/each} 
</ul>