-
Notifications
You must be signed in to change notification settings - Fork 0
@bynary.composables.attribute.Interface.IUseBooleanAttributeOptions
@bynary/composables / @bynary/composables/attribute / IUseBooleanAttributeOptions
A set of options for useBooleanAttribute
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
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>
IBindBooleanAttributeOptions
.defaultValue
attribute/src/boolean-attribute.composable.ts:73
optional
initialValue:boolean
The initial value of the attribute, overriding the value assigned in the DOM
const isDisabled = useBooleanAttribute('disabled', { initialValue: false });
<my-component #myComponent disabled></my-component>
This will output:
<my-component></my-component>
attribute/src/boolean-attribute.composable.ts:112
optional
namespace:string
The namespace of the attribute
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>
IBindBooleanAttributeOptions
.namespace
attribute/src/boolean-attribute.composable.ts:30
optional
target:Element
The target element on which the attribute should be bound. Can be any HTMLElement.
const isDisabled = useBooleanAttribute('disabled', { target: document.body });
Or with bindBooleanAttribute
:
const isDisabled = signal<boolean | undefined>(undefined);
bindBooleanAttribute('disabled', isDisabled, { target: document.body });