Search code examples
angularangular-templateangular-cdk

How is cdkPortal different from ngTemplateOutlet


Why should one use cdkPortal over the built-in directives ngTemplateOutlet and ngComponentOutlet in Angular. aren't both of them provide the same functionality? Are there specific features in the CDK Portal that doesn't come with the built-in directives?


Solution

  • If you look at the first example in the cdkPortal docs, you will notice one big advantage/commodity:

    cdkPortalOutlet unifies the functionality of ngTemplateOutlet and ngComponentOutlet by allowing devs. to embed both templates and components into the view dynamically.

    Furthermore, ComponentPortal allows to dynamically pass Injector instances, which can become handy in cases where you need finer control over the dependency resolution of the to-be-embedded component.