`toSignal()`

Converts an RxJS Observable into a signal that tracks its latest value.

Since Angular 16+ Spec ↗

Syntax

toSignal<T>(source: Observable<T>, options?): Signal<T | undefined>

Parameters

Name	Type	Required	Description
`source`	`Observable<T>`	No	The observable to subscribe to and mirror.
`options`	`object`	No	Supports initialValue, requireSync, and manualCleanup.

Returns

Signal<T | undefined> — Signal emitting the observable's most recent value.

Examples

import { Component, inject } from '@angular/core';
import { toSignal } from '@angular/core/rxjs-interop';
import { interval } from 'rxjs';

@Component({
  selector: 'app-clock',
  standalone: true,
  template: `<p>{{ ticks() }}</p>`,
})
export class ClockComponent {
  ticks = toSignal(interval(1000), { initialValue: 0 });
}

Notes

toSignal subscribes immediately and unsubscribes automatically when the enclosing context is destroyed. Without initialValue the signal starts as undefined; pass requireSync: true for synchronous sources to drop the undefined from the type. Must be called in an injection context.