CODEWITHSUNDEEP
angularng-bootstrap
Achutha K
Achutha K

Reputation: 47

Not able to display a button inside ng-accordian tag

i am using ngb-accordian to display accordians whenever a search text is found. now my requirement is to add a button on the heading. clicking on which will take me to another component.

the code in HTML goes like :

<ngb-accordion   #acc="ngbAccordion" activeIds="ngb-panel-0"> 
<ngb-panel [title]='(metadata.topic)?"Topic: "+metadata.topic:
(metadata.item)?"Product: "+metadata.item:"EMPTY"' *ngFor="let metadata of 
filteredData">
<button class="btn btn-secondary" type="button"><i class="fa fa-search"></i></button>
<ng-template ngbPanelContent>

  <ul>
      <li *ngFor='let key of metadata | keys'>
       {{key.key}} : {{key.value}}
      </li>
  </ul>
</ng-template>

i am new to angular and bootstrap please help

Upvotes: 1

Views: 1175

Answers (1)

Sahan Jayasuriya
Sahan Jayasuriya

Reputation: 165

Inside the ngb-panel add a ng-template tag like below

<ngb-accordion> 
    <ngb-panel>
        <ng-template ngbPanelTitle>
            <button>Button Text</button>
        </ng-template>
    </ngb-panel>
</ngb-accordion>

Upvotes: 4

Related Questions