01
Write a cart service using signals with computed totals.
Show answer
Expose read-only state and mutation methods.
@Injectable({ providedIn: 'root' })
export class CartService {
private items = signal<CartItem[]>([]);
readonly cart = this.items.asReadonly();
readonly count = computed(() => this.items().reduce((n, i) => n + i.qty, 0));
readonly total = computed(() => this.items().reduce((s, i) => s + i.qty * i.price, 0));
add(product: Product) {
this.items.update((list) => {
const found = list.find((i) => i.id === product.id);
return found
? list.map((i) => (i.id === product.id ? { ...i, qty: i.qty + 1 } : i))
: [...list, { ...product, qty: 1 }];
});
}
remove(id: string) { this.items.update((l) => l.filter((i) => i.id !== id)); }
}