@bynary/composables / @bynary/composables/attribute / IBindAttributeOptions

Interface: IBindAttributeOptions

A set of options for bindAttribute

Extended by

• IUseAttributeOptions

Properties

defaultValue?

optional defaultValue: string

The default value of the attribute, as a fallback, when no initial value has been defined and no value has been assigned in the DOM

Examples

const label = useAttribute('label', { defaultValue: 'baz' });

Or with bindAttribute

const label = signal<string | undefined>(undefined);
bindAttribute('label', label, { defaultValue: 'baz' });

Either of the above will output:

<my-component label="baz"></my-component>

const label = useAttribute('label', { defaultValue: 'baz' });

Or with bindAttribute

const label = signal<string | undefined>(undefined);
bindAttribute('label', mySignal, { defaultValue: 'baz' });

Either of the above will output:

<my-component label="foo"></my-component>

Defined in

attribute/src/attribute.composable.ts:65

---

namespace?

optional namespace: string

The namespace of the attribute

Example

A namespace xyz will result in an attribute my:<attribute-name>:

const label = useAttribute('label', { namespace: 'xyz', initialValue: 'baz' });

Or with bindAttribute

const label = signal('baz');
bindAttribute('label', mySignal, { namespace: 'xyz' });

Either of the above will output:

<my-component xyz:label="baz"></my-component>

Defined in

attribute/src/attribute.composable.ts:28

---

target?

optional target: Element

The target element on which the attribute should be bound

Example

import { useAttribute } from '@bynary/composables/attribute';

@Component({
    selector: 'my-component'
})
class MyComponent {

    label = useAttribute('label', { target: document.body });
}

Defined in

attribute/src/attribute.composable.ts:83