Code Explainers
Code explainers tagged #change-detection
typescript
import { Directive, ElementRef, EventEmitter, NgZone, OnDestroy, OnInit, Output } from '@angular/core'; interface Point { x: number;
Throttling pointer events with NgZone in Angular
change-detection
requestanimationframe
event-throttling
Advanced
8 steps
typescript
import { Directive, ElementRef, EventEmitter,
An infinite-scroll directive in Angular
intersectionobserver
directives
performance
Advanced
7 steps
typescript
import { Component, ComponentRef, Injector,
Dynamic component rendering in Angular
dynamic-components
viewcontainerref
lifecycle-hooks
Advanced
7 steps
typescript
import { Directive, ElementRef, EventEmitter, inject, NgZone, OnDestroy, Output } from '@angular/core'; @Directive({ selector: '[appResizeDebounced]',
A debounced resize directive in Angular
debounce
change-detection
host-bindings
Advanced
7 steps
typescript
import { Component, ChangeDetectionStrategy } from '@angular/core'; @Component({ selector: 'app-card',
Multi-slot content projection in Angular
content-projection
components
templates
Intermediate
7 steps
typescript
import { Component, ChangeDetectionStrategy, inject, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { ScrollingModule } from '@angular/cdk/scrolling'; import { toObservable } from '@angular/core/rxjs-interop';
Virtual scrolling a contact list in Angular
virtual-scrolling
signals
change-detection
Intermediate
6 steps
typescript
import { Pipe, PipeTransform, ChangeDetectorRef, NgZone, OnDestroy } from '@angular/core'; @Pipe({ name: 'timeAgo',
A self-refreshing timeAgo pipe in Angular
impure-pipe
change-detection
timers
Advanced
10 steps