Using template references and variables
In the previous section, we projected content using the ng-content
element. Yet, we ran into a limitation that didn’t allow you to use control flow or the *ngFor
, *ngIf
, or *ngSwitch
directives in combination with the ng-content
element. We will start by demonstrating how to resolve this using the ng-template element. After that, we will learn about other use cases and implementations of the ng-template
element and how you can create and use template variables within HTML templates.
We will create a display-scales component to demonstrate content projection with an ng-template
element and use directives on the project content. The display-scales
component is just a simple example to demonstrate the concept of content projection combined with structural directives such as *ngFor
.
Start using the Nx generator to create the display-scales
component next to the modal
component. The display-scales
component will receive an array of scale...