Project and Query Content

Build flexible containers and access child elements only when necessary.

Lesson content

Description ng-content lets a caller supply markup inside a reusable container. Queries obtain references to children or template elements. Prefer normal inputs for data and use queries for genuine view coordination. Code @Component({ selector: 'app-panel', template: ` ` }) export class Panel {} Usage Account Profile details Note The exact APIs can vary by Angular releases. Keep the stable concept separate from API-specific changes. Tip Build the smallest working project and query content example first, then add production concerns such as errors, cleanup, typing, and tests. Key takeaway Content projection is useful for cards, dialogs, and layout components that should not know the projected content.