Create multiple root components in Angular with Angular Elements

Share this video with your friends

Send Tweet

The main use case for compiling Angular Components into standalone Angular Elements and bundle them into a single JS file, is to use them within other environments. Such might include server side CMS systems or micro frontends. In such scenarios, an Angular Element or web component should be isolated, fulfil a single functionality and communicate with the outside world using inputs & outputs. You can however also compile multiple Angular Elements out of a single Angular app, use them separately inside some index.html file and even have them share the state over Angular services! Let's learn how!