skip to content
Alvin Lucillo

Content projection

/ 1 min read

angular

Below is a basic content projection example. Content project allows you to inject a component from parent to its child.

Parent component passing an h1 tag to app-test:

  <app-test>
    <h1 class="custom"> Ca va? </h1>
  </app-test>

Child component, with ng-content where projected/injected content is rendered

<ng-content select=".custom" />

In the example, select is used to select the component that has a custom class. You can remove this selector. This is just to demonstrate you can select which components to render.