ws-replace is similar to ws-hole , isn't?

Question

ws-replace

The attribute ws-replace creates a Doc or seq hole. The element on which this attribute is set will be replaced with the provided Doc(s). The name of the hole is the value of the ws-replace attribute.

ws-hole

The attribute ws-hole creates a Doc or seq hole. The element on which this attribute is set will have its contents replaced with the provided Doc(s). The name of the hole is the value of the ws-hole attribute.

---

Can you help me clearly distinguish these two concepts?

---

https://developers.websharper.com/docs/v4.x/fs/ui#reactive

Answer 1

ws-replace replaces the entire element, while ws-hole just replaces the contents. Look at the examples in the documentation you linked to. Notice how with ws-replace, the <div> element disappears and is completely replaced by the "Welcome" paragraph. Whereas with ws-hole, the <div> element is still there, wrapped around the "Welcome" paragraph.

Using ws-replace

<div ws-replace="Content"></div>

becomes:

<p>Welcome to my site.</p>

Using ws-hole

<div ws-hole="Content"></div>

becomes:

<div>
    <p>Welcome to my site.</p>
</div>