In most cases ViewChild is completely avoidable, as in your case. (Directly refer and access it in the template):

<app-accordion #accordion>

<ng-container accordion-header>

<div class="flex justify-between">

<p>Accordion Header Title</p>

<button (click)="accordion.toggleCollapsedStatus()" >

Accordion Trigger</button>

</div>

</ng-container>

<ng-container accordion-body>

<!-- Accordion Body -->

</ng-container>

</app-accordion>