Concorde documentation · same URL (interactive) · llms.txt

Concorde decorator — @onAssign. Legacy decorator that calls a method with the values at one or more string paths of the store, once all of them are defined. For new code, use @handle with { waitForAllDefined: true }: same behaviour, Doc ID: docs/decorators/on-assign. Keywords: Concorde, supersoniks, docs/decorators/on-assign, on-assign, @onAssign, decorator, onAssign, { waitForAllDefined: true }, DataProviderKey, null, undefined, connectedCallback, disconnectedCallback, ${prop}, @handle. URL: https://concorde.supersoniks.org/docs/decorators/on-assign.

@onAssign

Legacy decorator that calls a method with the values at one or more string paths of the store, once all of them are defined. For new code, use @handle with { waitForAllDefined: true }: same behaviour, with typed DataProviderKey paths.

Import

import { onAssign } from "@supersoniks/concorde/decorators";

@onAssign("passenger", "passengerSettings")
onReady(passenger: Passenger, settings: Settings) {}

Wait for every path

The method is called only when every path holds a value other than null or undefined, with the values in the order of the paths. After that, each assignment calls it again with the latest values. Subscriptions start after connectedCallback and stop in disconnectedCallback.

<docs-demo-sources for="demo-on-assign"></docs-demo-sources>
    <demo-on-assign></demo-on-assign>

Dynamic path

Paths accept ${prop} placeholders resolved on the host. While a placeholder is null or undefined, that path is unsubscribed. Write the paths as plain strings, not template literals. Rules: Dynamic path placeholders.

@property({ type: Number }) seat = 0;

@onAssign("passengers.${seat}", "passengerSettings.${seat}")
onSeat(passenger: Passenger, settings: Settings) {}

Migrate to @handle

// Before
@onAssign("passenger", "passengerSettings")
onReady(passenger: any, settings: any) {}

// After
const passengerKey = new DataProviderKey&lt;Passenger&gt;("passenger");
const settingsKey = new DataProviderKey&lt;Settings&gt;("passengerSettings");

@handle(passengerKey, settingsKey, { waitForAllDefined: true })
onReady(passenger: Passenger, settings: Settings) {}

@handle accepts up to three keys. For more paths, keep @onAssign or split the logic into several @handle methods.

API reference

Argument Type Description
...paths string[] Dot paths in the store ("flights.0.status"), optionally with ${prop} placeholders; the method receives one argument per path, in order