Advanced Examples
This example demonstrates the use of HTTP interceptors for caching API responses.
Cache HTTP requests in a service using RxJS shareReplay for efficient data reuse.
Explore advanced and practical uses of ng-template in Angular, including conditional rendering, template outlets, context passing, and custom structural directives.
Control the disabled state of a reactive form using a signal and the disableControl directive.
A reusable directive that auto-saves Angular form data to LocalStorage and an API, with debounce, dirty/touched state handling, and saving status.
Showcase of Angular 17+ hostDirectives for composing Tooltip and Highlight directives in a standalone component.
This example shows how to override ApplicationRef.tick to log every global change detection run, explains why async operations like setInterval do not trigger ticks, and demonstrates how to manually trigger change detection for performance analysis.
Demonstrates two-way binding and setter pattern using Angular signals. Shows how to use a signal and a setter function for input fields.
Implement a signal-based undo/redo stack for a form, showing how to track and revert state changes using Angular signals.
A real-time collaborative list using Angular signals and the browser storage event. Add, edit, or remove items and see changes sync instantly across tabs/windows—no backend required.
Open a modal using a service and ViewContainerRef. Demonstrates dynamic component creation and service-driven modals.
Preload modules only when triggered (e.g., on hover) using a service and custom PreloadingStrategy. Demonstrates bandwidth savings and modern Angular routing.
A fully reactive, typed, and form-friendly custom toggle control using ControlValueAccessor. Works with both reactive and template-driven forms.
