Why should you care?

Local UI state (filters, counters, selected id) is clearer with signals in modern AngularVerse screens.

See it live — copy this example

Run examples in an Angular CLI project (ng serve). Prefer standalone components and TypeScript strict mode.

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

count = signal(0);
double = computed(() => this.count() * 2);

inc() { this.count.update(v => v + 1); }

What happened?

• signal holds a value.
• Read with count().
• computed derives values.
• update/set change state and refresh dependents.

Practice next

1. Add a counter to a component template.
2. Show double().
3. Reset with set(0).
4. Add a disabled = computed(() => this.count() > 10).
5. Wire a button to inc().

Remember

Signals store sync state. computed is derived. Use () to read.

Filter chip state

Toggle active filters.

Outcome: Template updates without manual detectChanges.