Skip to content

Instantly share code, notes, and snippets.

@oliverjam
Created May 7, 2020 17:21
Show Gist options
  • Star 4 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save oliverjam/b0dbc6767950c7b00b6bb2151aabc6b4 to your computer and use it in GitHub Desktop.
Save oliverjam/b0dbc6767950c7b00b6bb2151aabc6b4 to your computer and use it in GitHub Desktop.
function html(strings, ...interpolations) {
return strings
.map((string, i) => {
let value = interpolations[i];
// 0 is falsy but a valid value in HTML
if (value === undefined || value === null || value === false) {
value = "";
}
// join arrays so they aren't stringified with commas
if (Array.isArray(value)) {
value = value.join("");
}
return string + value;
})
.join("");
}
// e.g
const fruit = ["banana", "apple", "orange"];
const list = html`
<ul>
${fruit.map(f => html`<li class="${f === "orange" && "orange"}>${f}</li>`)}
</ul>
`;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment