AnalogJS
Visual Editor
Live editing with the Localess Visual Editor in an AnalogJS app — enableSync, ll-document, and sync events.
Enabling live editing
Set enableSync: true in provideLocaless(), as in Setup. Inside the Visual Editor iframe, <ll-document> then applies input and change edits to the rendered page live — no extra wiring.
To react to editor events yourself, inject LocalessSyncService and use onChange() or on() — see the Angular Visual Editor page.
Static builds
Live editing needs Angular running in the browser, and prerendered pages hydrate into a full Angular app — so sync works in static builds too, as long as enableSync stays on. The analog-static playground keeps it on. Point the Visual Editor's preview environment at the deployed site — see Visual Editor setup.
Events
| Event | When |
|---|---|
input | A field value changed — every keystroke (real-time preview) |
change | Blocks added, removed, duplicated or reordered — and once when the preview connects, with the current content |
save | Content saved |
publish | Content published |
unpublish | Content unpublished |
pong | Editor heartbeat response |
enterSchema | Editor cursor enters a schema block |
hoverSchema | Editor cursor hovers over a schema block |
leaveSchema | Editor cursor leaves a schema block |