How to add components inside p-accordionTab header-CodePudding

I am kind of struggling with a small situation here. I have a p-acccordionTab like this

<p-accordion>
 <p-accordionTab header="Just testing">
   <h5>Nothing here</h5>
 </p-accordionTab>                                                                
</p-accordion>

looks something like this

I want to add some component like p-dropdown or p-inputSwitch in the header part of p-acccordionTab.For clarity

So far, I have tried using p-dropdown with appendTo property and also used header like this

 <p-accordion>
  <p-accordionTab header="Just testing">
    <header>
      <p-dropdown></p-dropdown>
    </header>
  </p-accordionTab>                                                                
 </p-accordion>

But these doesn't seem to work. Does anyone know how can this be achieved?

CodePudding user response：

You can pass custom template to p-accordion using header template

<p-accordion>
     <p-accordionTab >
          <ng-template pTemplate="header">
           <header>
            <p-dropdown></p-dropdown>
            </header>
           </ng-template>
     </p-accordionTab>                                                                
    </p-accordion>

Working Example