Angular 19 - Introduction to linkedSignal

Angular 19 is on the horizon, and it’s bringing a host of exciting new features to the table. One of the most notable additions is the linkedSignal primitive, which promises to revolutionize the way we handle reactive programming in Angular applications.

The Problem with Reset Patterns

Traditionally, implementing reset patterns in Angular involved using computed() signals. While effective, this approach has limitations. When you need to set the value of a signal explicitly, it becomes a read-only signal, hindering flexibility.

The linkedSignal Solution

linkedSignal addresses this limitation by providing a writable signal that automatically updates its value based on changes to a source signal. This enables us to create a seamless synchronization between the two, ensuring a glitch-free user experience.

Understanding linkedSignal

While linkedSignal will have multiple overloads, two of them are worth mentioning:

• linkedSignal with Source and Computation

This overload allows you to create a linkedSignal that computes its value based on the value of a source signal. Here's an example:

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



  const sourceSignal = signal(0);

  const linkedSignal = linkedSignal({

    source: this.sourceSignal,

    computation: () => this.sourceSignal() * 5,

  });

In this example, linkedSignal will always be twice the value of sourceSignal. Whenever sourceSignal changes, linkedSignal will automatically recompute its value. Here’s a more real-world example of linkedSignal:

.