Hi,
i could not find any way to programmatically expand/collapse the panels of the Accordion control at runtime. I am aware of the
selectedItems property, but this only seems to set the initial state of the panels, but does not do two-way data-binding at runtime (it is neither updated with the current state of the panels, not does the visible state change when changing the selectedItems property through code)...
Here is what I tried:
<ej-accordion enableMultipleOpen="true" [(selectedItems)]="selecteditems">
<h3>
<a rel='nofollow' href="#">Panel 1</a>
</h3>
<div>
Panel 1 Text
</div>
<h3>
<a rel='nofollow' href="#">Panel 2</a>
</h3>
<div>
Panel 2 Text
</div>
<h3>
<a rel='nofollow' href="#">Panel 3</a>
</h3>
<div>
Panel 3 Text
</div>
</ej-accordion>
<input type="button" ej-button id="button" [value]="Button" (click)="doClick()"/>
And for the Javascript side:
import {Component} from '@angular/core';
@Component({
selector: 'sd-home',
templateUrl: 'app/components/accordion/accordion.component.html'
})
export class AccordionComponent {
selecteditems: number
[]
;
constructor()
{
this.selecteditems = [0,1,2];
}
doClick()
{
// collapse all but the first
this.selecteditems = [0];
}
}
Can you please help here or provide a sample?
Thanks and best regards!