Skip to content

@bynary.composables.attribute.Interface.IUseBooleanAttributeOptions

github-actions[bot] edited this page Jul 11, 2024 · 3 revisions

@bynary/composables / @bynary/composables/attribute / IUseBooleanAttributeOptions

Interface: IUseBooleanAttributeOptions

A set of options for useBooleanAttribute

Extends

Properties

defaultValue?

optional defaultValue: boolean

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 isDisabled = useBooleanAttribute('disabled', { defaultValue: true });

Or with bindBooleanAttribute:

const isDisabled = signal<boolean | undefined>(undefined);
bindBooleanAttribute('disabled', isDisabled, { defaultValue: true });
<my-component></my-component>

This will output:

<my-component disabled></my-component>
const isDisabled = useBooleanAttribute('disabled', { defaultValue: false });

Or with bindBooleanAttribute:

const isDisabled = signal<boolean | undefined>(undefined);
bindBooleanAttribute('disabled', isDisabled, { defaultValue: false });
<my-component disabled></my-component>

This will output:

<my-component disabled></my-component>

Inherited from

IBindBooleanAttributeOptions.defaultValue

Defined in

attribute/src/boolean-attribute.composable.ts:73


initialValue?

optional initialValue: boolean

The initial value of the attribute, overriding the value assigned in the DOM

Example

const isDisabled = useBooleanAttribute('disabled', { initialValue: false });
<my-component #myComponent disabled></my-component>

This will output:

<my-component></my-component>

Defined in

attribute/src/boolean-attribute.composable.ts:112


namespace?

optional namespace: string

The namespace of the attribute

Example

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

const isDisabled = useBooleanAttribute('disabled', { namespace: 'xyz', initialValue: true });

Or with bindBooleanAttribute:

const isDisabled = signal(true);
bindBooleanAttribute('disabled', isDisabled, { namespace: 'xyz' });

This will output:

<my-component xyz:disabled></my-component>

Inherited from

IBindBooleanAttributeOptions.namespace

Defined in

attribute/src/boolean-attribute.composable.ts:30


target?

optional target: Element

The target element on which the attribute should be bound. Can be any HTMLElement.

Example

const isDisabled = useBooleanAttribute('disabled', { target: document.body });

Or with bindBooleanAttribute:

const isDisabled = signal<boolean | undefined>(undefined);
bindBooleanAttribute('disabled', isDisabled, { target: document.body });

Inherited from

IBindBooleanAttributeOptions.target

Defined in

attribute/src/boolean-attribute.composable.ts:88

Clone this wiki locally