For loop in html component?

💬 App Building
,
2

Hey @phevil! Would something like this work? You can write JS in a JS transformer and then throwing the transformer value into the HTML component.

I'm looping through my array to add <li> to each element, putting it all inside a <ul>, then returning the results (and also removing the commas with regex).

Here's my code:

const RenderNames = () => {
  const names = ["Jeff","Linguine","Nova","Bao"];

  const renderNames = (allNames) => {
    return Object.entries(allNames).map(([_key, value]) => `<li>hello ${value}</li>`);
  };

  return `<ul> ${renderNames(names)} </ul>`;
};

return RenderNames().replace(/[, ]+/g,' ').trim()

image
image2526×1224 300 KB

Let me know if you have any questions at all!

1 Like