Angular Accordion Sample

<div ng-controller="AccordionSampleController">
    <h1>Accordion Sample</h1>

    <div class="checkbox">
        <input type="checkbox" name="oneAtATime" ng-model="oneAtATime">
        <label for="oneAtATime" class="checkbox">Open only one at a time</label>
    </div>

    <accordion close-others="oneAtATime" class="top">
        <accordion-group heading="Static Header, initially expanded" is-open="true">
            This content is straight in the template.
        </accordion-group>
        <accordion-group heading="" ng-repeat="group in groups">

        </accordion-group>
        <accordion-group heading="Dynamic Body Content">
            <p>The body of the accordion group grows to fit the contents</p>
            <button class="button small" ng-click="addItem()">Add Item</button>
            <div ng-repeat="item in items"></div>
        </accordion-group>
        <accordion-group is-open="isopen">
            <accordion-heading>
                I can have markup, too! <i class="right" ng-class="{'fa fa-chevron-down': isopen, 'fa fa-chevron-right': !isopen}"></i>
            </accordion-heading>
            This is just some content to illustrate fancy headings.
        </accordion-group>
    </accordion>

</div>