Atry/html.scala

Members list

Concise view

Packages

Includes the @html annotation to create reactive web applications

Includes the @html annotation to create reactive web applications

Attributes

Example:

An html interpolation that includes a single root node should be a subtype of Binding.Stable[Node].

 import com.yang_bo.html.*
 import com.thoughtworks.binding.Binding
 import com.thoughtworks.binding.Binding.Var
 import org.scalajs.dom.HTMLParagraphElement
 val color = Var("brown")
 def animal = "dog"
 val p: Binding.Stable[HTMLParagraphElement] =
   html"""
The quick ${color.bind} fox jumps over the lazy ${animal}"""

It can be then rendered into a parent node.

 import org.scalajs.dom.document
 render(document.body, p)
 document.body.innerHTML should be(
   """
The quick brown fox jumps over the lazy dog"""
 )

If the html reference a data binding expression via com.thoughtworks.binding.Binding.bind, it will automatically change whenever the upstream data changes.

 color.value = "red"
 document.body.innerHTML should be(
   """
The quick red fox jumps over the lazy dog"""
 )

An html interpolation that includes multiple single root nodes should be a BindingSeq[Node].

 import com.yang_bo.html.*
 import com.thoughtworks.binding.Binding.BindingSeq
 import org.scalajs.dom.Node
 import org.scalajs.dom.document
 def myId = "my-id"
 val nodes: BindingSeq[Node] =
   html"""
1 ${"foo"}2${"bar"}3
${"baz"}"""
 render(document.body, nodes)
 document.body.innerHTML should be(
   """
1 foo2bar3
baz"""
 )