CODEWITHSUNDEEP
angularbootstrap-4accordionngx-bootstrap
Junior Gantin
Junior Gantin

Reputation: 2192

How can I add icon into ngx-bootstrap accordion-group heading?

Using ngx-bootstrap, how can I add an icon to accordion-group heading? For example:

<accordion-group heading="<i class='fa fa-users'></i> Users"> This content is straight in the template. </accordion-group>

Upvotes: 12

Views: 7555

Answers (2)

Bhadresh Patel
Bhadresh Patel

Reputation: 2080

You can set font awesome icon with below way.

<accordion-group [isOpen]="false" #accGroup>
  <button class="btn btn-light float-right">
    <i class="fa" [ngClass]="{'fa-arrow-down': accGroup?.isOpen, 'fa-arrow-up': !accGroup?.isOpen}"></i>
  </button>
</accordion-group>

Upvotes: 3

Carol Skelly
Carol Skelly

Reputation: 362680

I think it can be done like this..

<accordion-group #group>
    <span accordion-heading>
      <i class='fa fa-users'></i> Users
    </span>
    This content is straight in the template. 
</accordion-group>

Upvotes: 18

Related Questions