1

I have a list of ngbpanels generated using ngFor. I need to expand/de-expand a specific panel according to some logic, however the name I pass for the panel ID is a variable. The code does not identify the panel ID and thus does not toggle it. How can I format the variable such that it is identified.

In the html file

<ngb-accordion #acc="ngbAccordion" >
<ngb-panel *ngFor="let panel of panels; let panelIndex=index" id="{{panelIndex}}">
....

In the ts file:

@ViewChild('acc') panelsView;
....
this.panelsView.toggle(this.panelIndex);

The issue is that toggle would take a string like this: .toggle('panelId'), where panelId is the real string representing the id of the panel. The issue is that I want to pass a variable. I tried .toggle(" '+this.panelIndex+' "), but it did not work, any suggestions?

Donia Zaela
  • 317
  • 1
  • 4
  • 15

1 Answers1

2

Convert the panelIndex: number into a string and pass it to the toggle() method:

this.panelsView.toggle('' + this.panelIndex);

See a working plunkr at http://plnkr.co/edit/6K83uv54zV0PFjrt0EO4?p=preview

Source: What's the best way to convert a number to a string in JavaScript?, https://ng-bootstrap.github.io/#/components/accordion/api

Capricorn
  • 2,061
  • 5
  • 24
  • 31