Valdres

injectAtom

Signature
injectAtom<T>(atom: Atom<T>): AtomSignal<T>

valdres-angular Subscribe to and update an atom's value

Returns an Angular WritableSignal that stays in sync with the atom. Reading the signal returns the current value, and calling .set() or .update() updates the atom. Also provides a .reset() method.

Usage

import { Component } from "@angular/core"
import { atom } from "valdres"
import { injectAtom } from "valdres-angular"

const countAtom = atom(0)

@Component({
    selector: "app-counter",
    template: `
        <span>{{ count() }}</span>
        <button (click)="count.update(c => c + 1)">+</button>
        <button (click)="count.reset()">Reset</button>
    `,
})
export class CounterComponent {
    count = injectAtom(countAtom)
}

Returns

AtomSignal<T> extends Angular's WritableSignal<T> with:

MethodDescription
()Read the current value
.set(value)Set a new value
.update(fn)Update based on previous value
.reset()Reset to the atom's default value

See also