Les Signals : concepts fondamentaux

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

const count = signal(0);

console.log(count()); // 0 — lecture via appel de fonction
count.set(5);
console.log(count()); // 5

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

const firstName = signal('Nicolas');
const lastName = signal('Dupont');

const fullName = computed(() => `${firstName()} ${lastName()}`);

console.log(fullName()); // "Nicolas Dupont"
firstName.set('Jean');
console.log(fullName()); // "Jean Dupont" — recalculé automatiquement

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

const theme = signal<'light' | 'dark'>('light');

effect(() => {
  document.body.setAttribute('data-theme', theme());
});

theme.set('dark'); // applique automatiquement l'attribut

import { toSignal, toObservable } from '@angular/core/rxjs-interop';

// Observable → Signal
const data = toSignal(this.http.get('/api/data'), { initialValue: null });

// Signal → Observable
const count$ = toObservable(this.count);