Template Support in EJ 1 Angular Accordion

7 Jun 2017 / 2 minutes to read

In JavaScript, you can load the contents or HTML elements directly inside the <div> element that you are going to convert as Accordion control.

html

<ej-accordion [enableMultipleOpen]="true">
   <h3>
        <a href="#">GARDEN FRESH (Veg)</a>
    </h3>
    <div>
        <img src="../content/accordion/garden-veggie.png" alt="garden-fresh" />
        <div class="ingredients">
            Rate    : $50
            <br />
            Ingredients : cheese, onions, green capsicums & tomatoes.
        </div>
    </div>
    <h3>
        <a href="#">CORN & SPINACH (Veg)</a>
    </h3>
    <div>
        <img src="../content/accordion/corn-and-spinach-05.png" alt="garden-fresh" />
        <div class="ingredients">
            Rate    : $70
            <br />
            Ingredients : cheese, sweet corn & green capsicums.
        </div>
    </div>
    <h3>
        <a href="#">CHICKEN DELITE (Non-veg)</a>
    </h3>
    <div>
        <img src="../content/accordion/chicken-delite.png" alt="garden-fresh" />
        <div class="ingredients">
            Rate    : $100
            <br />
            Ingredients : cheese, chicken chunks, onions & pineapple chunks.
        </div>
    </div>
</ej-accordion>