View on GitHub

Dropdown-angular

Simple dropdown directive for angular

Download this project as a .zip file Download this project as a tar.gz file

Dropdown-angular demo

Simple case:

Dropdown opened? {{open}}
I am simple one level dropdown
  • First item
  • Second item
  • Third item
<button ng-click='open = !open'>Toggle first dropdown</button>
<div>Dropdown opened? {{open}}</div>
<div class='ya-dropdown' is-open='open'>
    I am simple one level dropdown
    <button class='ya-dropdown-toggle'>click me</button>
    <div class='ya-dropdown-content'>
        <ul>
            <li>First item</li>
            <li>Second item</li>
            <li>Third item</li>
        </ul>
    </div>
</div>

Nested dropdowns:

I am nested dropdown
  • First item
  • Second item
  • I am inner dropdown
    • First item
    • Second item
    • Third item
<div class='ya-dropdown'>
    I am nested dropdown
    <button class='ya-dropdown-toggle'>click me</button>
    <div class='ya-dropdown-content'>
        <ul>
            <li>First item</li>
            <li>Second item</li>
            <li>
                <div class='ya-dropdown'>
                    I am inner dropdown
                    <button class='ya-dropdown-toggle'>click me</button>
                    <div class='ya-dropdown-content'>
                        <ul>
                            <li>First item</li>
                            <li>Second item</li>
                            <li>Third item</li>
                        </ul>
                    </div>
                </div>
            </li>
        </ul>
    </div>
</div>