Collapse
Collapse component is used to show and hide content with a smooth transition.
Collapse component is a simple component that can be used to collapse any element. It uses the collapsed input property to determine whether the element should be collapsed or not.
Example
Collapse example
this is a collapsable div.
this is a collapsable div.
this is a collapsable div.
this is a collapsable div.
this is a collapsable div.
collapse-example.component.html
<ng0-collapse [collapsed]="collapsed()">
<div class="border">
this is a collapsable div. <br />
this is a collapsable div. <br />
this is a collapsable div. <br />
</div>
</ng0-collapse>
<button class="btn btn-primary" (click)="collapsed.set(!collapsed())">
Toggle Collapse
</button>
collapse-example.component.ts
import { Component, signal } from '@angular/core';
import { CollapseModule } from '@bootkit/ng0/components/collapse';
@Component({
selector: 'app-collapse-example',
templateUrl: './collapse-example.component.html',
imports: [CollapseModule]
})
export class CollapseExampleComponent {
collapsed = signal(false);
}