[Fixed] Get name from clicked accordion

Issue

Hello I got simple accordion based on api "names"

<div *ngFor="let item of showDirNames | async | filter: name; let i = index;">
   <button class="accordion" (click)="toggleAccordian($event, i)"> {{item.name}} </button>
   <div class="panel" *ngFor="let child of fileUploads | async | filter: name" hide="!item.isActive">
      <p *ngFor="let child of fileNames| async | filter: name"> {{child.name}} </p>
   </div>
</div>

it looks like:

DirName_1

• file_name
• file_name

DirName_2

• file_name
• file_name

When I clic on DirName_1 I getting list of file names inside this directory.
How can I get name (for example DirName_1) from user? I want to know which accordion user clicked.
To server files names for him.

Solution

You will need to pass the item.name to toggleAccordian (btw: you misspelled toggleAccordion):

<div *ngFor="let item of showDirNames | async | filter: name; let i = index;">
   <button class="accordion" (click)="toggleAccordian($event, i, item.name)"> {{item.name}} </button>
   <div class="panel" *ngFor="let child of fileUploads | async | filter: name" hide="!item.isActive">
      <p *ngFor="let child of fileNames| async | filter: name"> {{child.name}} </p>
   </div>
</div>

toggleAccordian is not fixed in this example, you will have to change every occurrence yourself (if you want to).