Promise as a value of an expression is not supported. However, the library supports promises by the html.resolve method.

html.resolve(promise: Promise, placeholder: Function, delay = 200): Function
  • arguments:

    • promise - promise, which should resolve/reject update function

    • placeholder - update function for render content until promise is resolved or rejected

    • delay - delay in milliseconds, after which placeholder is rendered

  • returns:

    • update function compatible with content expression

const promise = asyncApi().then(...);
.then((value) => html`<div>${value}</div>`)
.catch(() => html`<div>Error!</div>`),

Click and play with web component example connected to external API:

Edit <async-user> web component built with hybrids library