Code Explainers

Code explainers tagged #change-detection

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