src/lib/markup-kit/collapse/collapse/collapse.component.ts
Component for displaying a collapsible content.
Example of usage:
<mefdev-collapse [Disabled]="false" [Active]="true" (stateChange)="onStateChange($event)">
<ng-template #CardTitle>
<!-- Content for the card title -->
<h3>Card Title</h3>
</ng-template>
<!-- Content for the collapsible section -->
<div>
Content inside collapse
</div>
</mefdev-collapse>
| host | { |
| selector | mefdev-collapse |
| styleUrls | ./collapse.component.scss |
| templateUrl | ./collapse.component.html |
Properties |
Methods |
Inputs |
Outputs |
Accessors |
constructor(_collapseSet: CollapseSetComponent, _elementRef: ElementRef)
|
|||||||||
|
Parameters :
|
| Active |
Type : boolean
|
|
Indicates whether the collapse is active or not. |
| Disabled |
Type : boolean
|
|
Indicates whether the collapse is disabled.
Set this to |
| clickHeader | ||||||||
clickHeader($event: MouseEvent)
|
||||||||
|
Event handler for the header click event. Toggles the active state of the collapse and emits the state change event.
Parameters :
Returns :
void
|
| _active |
Default value : false
|
| _el |
| CardTitle |
Type : TemplateRef<void>
|
Decorators :
@ContentChild('CardTitle')
|
|
ContentChild for the template of the card title. Example: |
| Disabled | ||||||
getDisabled()
|
||||||
setDisabled(value: boolean)
|
||||||
|
Indicates whether the collapse is disabled.
Set this to
Parameters :
Returns :
void
|
| Active | ||||||
getActive()
|
||||||
setActive(value: boolean)
|
||||||
|
Indicates whether the collapse is active or not.
Parameters :
Returns :
void
|