hardFrontend

What are Angular Signals?

Q: What are Angular Signals?

**Core concept.** Signals (Angular 16+) are a **reactive primitive**: a signal() holds a value, **reading** it tracks the reader as a dependency, and **writing** it notifies dependents to recompute. computed() derives values, and effect() runs side effects when dependencies change — enabling **fine-grained**, efficient updates (and eventually zoneless change detection). signal(0) <line class='d-edge-accent' x1='150' y1='86' x2='258' y2='98' marke

384 views

Understand the problem

Explain the modern signals reactivity model.

signalsreactivity

Attempt it yourself

Sketch your approach before reading the solution — that's what interviews test.

Stuck? AI Nudge Available

Get a conceptual hint to guide your logic without spoiling the final implementation.

Study the solution

The solution is waiting

Give it an honest attempt first — then compare your thinking with the full walkthrough.

Read the code

signal, computed, effect

import { Component, signal, computed, effect } from '@angular/core';

@Component({
  selector: 'app-root',
  standalone: true,
  template: '<button (click)="inc()">count {{ count() }} → doubled {{ doubled() }}</button>',
})
export class AppComponent {
  count = signal(0);
  doubled = computed(() => this.count() * 2);   // derived + memoized

  constructor() {
    effect(() => console.log('count is', this.count())); // reacts to changes
  }
  inc() { this.count.update(c => c + 1); }
}

Join the discussion

Discussion (0)

No responses yet. Be the first to share what you think.

What is runInInjectionContext and when do you need to use it?

What is the difference between Subject, BehaviorSubject, and ReplaySubject?