Docs / Infrastructure
SenseBindDirective
Headless attribute directive that applies a dynamic map of DOM properties to the host (with aria-* key normalization). It is not two-way binding and not a forms helper — prefer native [attr.aria-expanded]="open()" when the attribute set is fixed.
Live demo: run nx serve showcase and open /guides/bind (port 4202).
Overview
Category: Infrastructure. Selector: [senseBind]. Import: import { SenseBindDirective } from '@artificialsenselabs/ui';
<button
[senseBind]="{ 'aria-expanded': open(), 'aria-controls': panelId }"
>
Menu
</button>Inputs
| Input | Type | Default | Description |
|---|---|---|---|
senseBind | Record<string, unknown> | {} | Map of DOM properties to apply. aria-* keys are normalized to camelCase. null clears; undefined is treated as an omitted key. |
When to use
- Use when the set of keys is computed (signal-built ARIA maps, conditional attributes).
- Prefer explicit
[attr.*]/ property bindings for one or two fixed attributes. - Removed keys are cleared only when the host still holds the previously applied value.