Skip to content

@bynary.composables.class.Function.bindClass

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

@bynary/composables / @bynary/composables/class / bindClass

Function: bindClass()

bindClass<T>(className, value): T

Toggles a class on the host element based on the value of a signal. Similar to useClass, but accepts a boolean signal as an input instead of creating a new one. Will return the signal that has been passed in.

Type Parameters

T extends Signal<boolean>

Parameters

className: string

The name of the class to toggle

value: T

The signal to determine whether the class should be added or removed. When the signal's value is true, the class will be applied. Else it will be removed.

Returns

T

Example

import { bindClass } from '@bynary/composables/class';

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

    isLoading: Signal<boolean> = signal(false);

    constructor() {
        bindClass('loading', this.isLoading);
    }
}
<my-component></my-component>

This will output:

<my-component class="loading"></my-component>

Defined in

class/src/class.composable.ts:105

Clone this wiki locally