Question

我有一个生成的儿童手风琴列表，每个手风琴都在父母手风琴中使用ngFor生成的面板列表的一个面板内。我需要根据一些逻辑来切换特定的儿童手风琴。但是它不起作用，我无法在ngfor中生成的手风琴列表中识别出一个手风琴。

在html文件中

<ngb-accordion #acc1="ngbAccordion" >
 <ngb-panel #parentPanel *ngFor="let parentPanel of parentPanels; let parentPanelIndex=index" id="{{parentPanelIndex}}">
   <ngb-accordion #acc2="ngbAccordion" >
    <ngb-panel *ngFor="let childPanel of ChildrenPanels; let childPanelIndex=index" id="{{childPanelIndex}}">
  ....

在ts文件中：

@ViewChildren('parentPanels') parentPanels: QueryList<NgbPanel>;
....
this.parentPanels.toArray()[this.parentPanelIndex]

最后一行将根据存储在＆＃34; parentPanelIndex＆＃34;中的值为我提供对特定面板的引用。现在我可以访问父面板，但我不知道如何在该面板中获得对accordion（acc2）的引用。有什么建议吗？

Answer 1

您可以使用querySelector将子项置于

之类的自定义位置

 const child = this.panelsView
    .nativeElement
    .querySelector(`:nth-child(${this.elem})`);
    this.result = child.innerHTML;

你可以在这里找到一个例子https://stackblitz.com/edit/angular-dwmajp

Answer 2

ngbAccordion有一个名为activeIds的属性，它接受您要保持打开的所有ngb-panel的 ID 。

activeIds应该是您要保持打开的 ID 数组。

有关详细信息，请访问official documentation。

如何在角度2中的ngfor内生成的手风琴列表中访问特定的手风琴

2 个答案: