Module 2: Components & Templates

Angular Tutorial / Module 2
Module 2 · 14 lessons · ~6 hrs

Components & Templates

Anatomy, template syntax, lifecycle, pipes, directives, content projection, host elements, signal queries, dynamic components.

2.1 Angular Component Anatomy: @Component, Template, Selector, and Standalone Imports [2026] BEG Read 2.2 Angular Template Syntax Deep Dive: @if @for @switch @let, Bindings, Two-Way [2026] BEG Read 2.3 Angular 22 Selectorless Components: Import Classes Directly into Templates [2026] INT Read 2.4 Angular Input Signals Explained: input(), input.required(), Transforms, Aliases [2026] BEG Read 2.5 Angular Output Signals: output(), Event Payloads, and When to Still Use EventEmitter [2026] BEG Read 2.6 Angular Content Projection: <ng-content>, Multi-Slot, select, ngProjectAs [2026] BEG Read 2.7 Angular Component Lifecycle Hooks in 2026: Every Hook, effect(), and afterNextRender [2026] BEG Read 2.8 Angular Pipes: Every Built-in Pipe, Custom Pipes, and Pure vs Impure [2026] BEG Read 2.9 Angular Directives: Attribute, Structural, Custom — Everything You Need [2026] BEG Read 2.10 Angular ng-template and ng-container: Template Fragments, Logical Grouping, ngTemplateOutlet [2026] BEG Read 2.11 Angular Styling and ViewEncapsulation: Emulated, ShadowDom, None, :host, ::ng-deep [2026] BEG Read 2.12 Angular Host Elements &#038; host: Metadata: Binding to the Wrapping Element [2026] INT Read 2.13 Angular Signal Queries: viewChild, contentChild, viewChildren, contentChildren [2026] INT Read 2.14 Angular Programmatic Component Creation: ViewContainerRef.createComponent() for Modals, Toasts, Plugins [2026] ADV Read