projects/rebirth-ng/src/lib/accordion/accordion.component.ts
exportAs | accordion |
providers |
{ : , : (() => ) }
|
selector | re-accordion |
templateUrl | ./accordion.component.html |
Properties |
Methods |
|
Inputs |
Outputs |
constructor(rebirthNGConfig: RebirthNGConfig)
|
||||||
Parameters :
|
closable
|
Type: |
keepOneItem
|
Type: |
cssClass
|
Type: |
Inherited from
PanelGroup
|
|
Defined in PanelGroup:6
|
type
|
Type: |
Inherited from
PanelGroup
|
|
Defined in PanelGroup:5
|
close
|
$event type: EventEmitter
|
Protected initPanel | ||||||
initPanel(panel: PanelComponent)
|
||||||
Parameters :
Returns :
void
|
Private keepOnePanelOpen | ||||
keepOnePanelOpen(panel: )
|
||||
Parameters :
Returns :
void
|
toggle | ||||||
toggle(panel: PanelComponent)
|
||||||
Parameters :
Returns :
void
|
toggleById | ||||
toggleById(id: )
|
||||
Parameters :
Returns :
void
|
$addItem | ||||||
$addItem(panel: PanelComponent)
|
||||||
Inherited from
PanelGroup
|
||||||
Defined in PanelGroup:9
|
||||||
Parameters :
Returns :
void
|
$removeItem | ||||||
$removeItem(panel: PanelComponent)
|
||||||
Inherited from
PanelGroup
|
||||||
Defined in PanelGroup:24
|
||||||
Parameters :
Returns :
void
|
$removeItemById | ||||
$removeItemById(id: )
|
||||
Inherited from
PanelGroup
|
||||
Defined in PanelGroup:19
|
||||
Parameters :
Returns :
void
|
Protected initPanel | ||||||
initPanel(panel: PanelComponent)
|
||||||
Inherited from
PanelGroup
|
||||||
Defined in PanelGroup:37
|
||||||
Parameters :
Returns :
any
|
Private removeItemByIndex | ||||||
removeItemByIndex(index: number)
|
||||||
Inherited from
PanelGroup
|
||||||
Defined in PanelGroup:31
|
||||||
Parameters :
Returns :
void
|
panels |
panels:
|
Type : PanelComponent[]
|
Default value : []
|
Inherited from
PanelGroup
|
Defined in PanelGroup:7
|
import { Component, Input, forwardRef, Output, EventEmitter } from '@angular/core';
import { PanelComponent } from '../panel/panel.component';
import { PanelGroup } from '../panel/panel-group.model';
import { RebirthNGConfig } from '../rebirth-ng.config';
@Component({
selector: 're-accordion',
templateUrl: './accordion.component.html',
exportAs: 'accordion',
providers: [{ provide: PanelGroup, useExisting: forwardRef(() => AccordionComponent) }],
})
export class AccordionComponent extends PanelGroup {
@Input() keepOneItem: boolean;
@Input() closable: boolean;
@Output() close = new EventEmitter<PanelComponent>();
constructor(rebirthNGConfig: RebirthNGConfig) {
super();
this.keepOneItem = rebirthNGConfig.accordion.keepOneItem;
this.closable = rebirthNGConfig.accordion.closable;
this.type = <any>rebirthNGConfig.accordion.type;
}
protected initPanel(panel: PanelComponent) {
panel.collapsable = true;
panel.isCollapsed = true;
panel.closable = this.closable;
panel.close.subscribe(item => this.close.emit(item));
panel.collapse.subscribe(collapse => {
if (!collapse) {
this.keepOnePanelOpen(panel);
}
});
}
toggleById(id) {
const panel = this.panels.find(item => item.id === id);
this.toggle(panel);
}
toggle(panel: PanelComponent) {
if (panel) {
panel.onCollapse();
}
}
private keepOnePanelOpen(panel) {
if (this.keepOneItem) {
this.panels.forEach(item => {
if (item !== panel) {
item.isCollapsed = true;
}
});
}
}
}
<div role="tablist" class="panel-group">
<ng-content></ng-content>
</div>