---
url: >-
  https://lit-ui-router.dev/reference/lit-ui-router-signals/classes/SignalController.md
---
[lit-ui-router-signals](../index.md) / SignalController

# Class: SignalController\<T>

Defined in: [signal-controller.ts:42](https://github.com/simshanith/lit-ui-router/blob/740888c2b2ba358c4dfa52a122e927df6a604b12/packages/lit-ui-router-signals/src/signal-controller.ts#L42)

A ReactiveController that composes TC39 Signals with the Lit lifecycle:
while the host is connected it watches a selector through a
`Signal.Computed` and calls `host.requestUpdate()` when the selected value
changes.

A selector-based alternative to `@lit-labs/signals`' `SignalWatcher`
mixin: no base class, explicit dependencies, and an `equals` comparer for
value-based change detection. Changes are delivered in a microtask, since
a watcher may not read signals while one is being set.

The selector runs immediately on every (re)connect, so hosts that re-enter
the DOM (e.g. sticky routed components) synchronize with current values.
The selected value is exposed as `.value` for use in `render()`.

## Type Parameters

| Type Parameter |
| ------ |
|  `T` |

## Implements

* [`ReactiveController`](https://lit.dev/docs/api/controllers/#ReactiveController)

## Constructors

### Constructor

```ts
new SignalController<T>(
   host, 
   expression, 
   options?
): SignalController<T>;
```

Defined in: [signal-controller.ts:48](https://github.com/simshanith/lit-ui-router/blob/740888c2b2ba358c4dfa52a122e927df6a604b12/packages/lit-ui-router-signals/src/signal-controller.ts#L48)

#### Parameters

| Parameter | Type |
| ------ | ------ |
| `host` | [`ReactiveControllerHost`](https://lit.dev/docs/api/controllers/#ReactiveControllerHost) |
| `expression` | () => `T` |
| `options?` | [`SignalControllerOptions`](../interfaces/SignalControllerOptions.md)<`T`> |

#### Returns

`SignalController`<`T`>

## Properties

| Property | Type | Description | Defined in |
| ------ | ------ | ------ | ------ |
|  `value` | `T` | the selected value as of the last read; read it in `render()` | [signal-controller.ts:44](https://github.com/simshanith/lit-ui-router/blob/740888c2b2ba358c4dfa52a122e927df6a604b12/packages/lit-ui-router-signals/src/signal-controller.ts#L44) |

## Methods

### hostConnected()

```ts
hostConnected(): void;
```

Defined in: [signal-controller.ts:58](https://github.com/simshanith/lit-ui-router/blob/740888c2b2ba358c4dfa52a122e927df6a604b12/packages/lit-ui-router-signals/src/signal-controller.ts#L58)

Called when the host is connected to the component tree. For custom
element hosts, this corresponds to the `connectedCallback()` lifecycle,
which is only called when the component is connected to the document.

#### Returns

`void`

#### Implementation of

`ReactiveController.hostConnected`

***

### hostDisconnected()

```ts
hostDisconnected(): void;
```

Defined in: [signal-controller.ts:70](https://github.com/simshanith/lit-ui-router/blob/740888c2b2ba358c4dfa52a122e927df6a604b12/packages/lit-ui-router-signals/src/signal-controller.ts#L70)

Called when the host is disconnected from the component tree. For custom
element hosts, this corresponds to the `disconnectedCallback()` lifecycle,
which is called the host or an ancestor component is disconnected from the
document.

#### Returns

`void`

#### Implementation of

`ReactiveController.hostDisconnected`