Embedding Interactive Components in Markdown
Learn how to use Analog's new Markdown Components (MDC) to embed live Angular components in your blog posts.
Interactive Demos in Blog Posts
AnalogJS allows making your content interactive. Instead of just static code blocks, you can now embed real Angular components via Custom Elements.
Live Counter Demo
Below is an interactive counter component embedded directly via a Custom Element:
How it works
The custom element is registered in main.ts using Angular Elements.
When the browser encounters this tag in the rendered Markdown, it instantiates the corresponding Angular component.
All attributes on the tag are passed as Inputs to the Angular component (mapped to kebab-case).
Enjoy building interactive content with Analog!