Angular 8手風琴具有動態數據，無需使用引導程序/ Angular材料

Question

我試圖在不使用引導程序/角度材料手風琴的情況下實現手風琴功能。 我的數據來自api。

我嘗試在下面進行操作，但這會同時打開和關閉所有面板。 我了解背后的原因，但不了解如何處理。

Component.ts

export class AccordionComponent implements OnInit {
    isHidden = true;
    mFaqs: IFaq[];
    constructor(private faqService: FaqService) { }

    ngOnInit() {
        this.faqService.getFaqs()
            .subscribe(faqData => this.mFaqs = faqData );
    }

}

component.html

<div class="custom-header" hideToggle="true" (click)="isHidden = !isHidden" *ngFor="let faq of mFaqs?.faqs">
    <section>
        <section>
            Q: {{ faq.question }}
        </section>
        <p [hidden]="isHidden">
            {{ faq.answer }}
        </p>
    </section>

</div>

它應該只關閉/打開被點擊的那個。

Answer 1

您需要為此傳遞唯一的ID。

可能會為您提供幫助。

多個項目的角度單擊事件

請通過它。