Angular-Dropdowns Examples

Examples for https://github.com/jseppi/angular-dropdowns

by ipark

HTML

<link rel="stylesheet" href="//rawgithub.com/jseppi/angular-dropdowns/master/css/normalize.css">
<link rel="stylesheet" href="//rawgithub.com/jseppi/angular-dropdowns/master/css/dropdown.css">
<link rel="stylesheet" href="//rawgithub.com/jseppi/angular-dropdowns/master/css/page.css">
<script src="//rawgithub.com/jseppi/angular-dropdowns/master/lib/angular-1.1.5/angular.js"></script>
<script src="//rawgithub.com/jseppi/angular-dropdowns/master/scripts/dropdown.js"></script>
<script src="//rawgithub.com/jseppi/angular-dropdowns/master/scripts/app.js"></script>
<body ng-app="app" style="margin-top:50px;">
    <div ng-controller="AppCtrl">
        <div style="margin:0 auto; text-align:center;">
            <h1>Dropdown Select</h1>
            <p>You have selected: {{ddSelectSelected}}</p>
            <div dropdown-select="ddSelectOptions" dropdown-model="ddSelectSelected"></div>
            <hr/>
            
            <h1>Dropdown Menu</h1>
            
            <h2>On a Button</h2>
            <p>You have selected: {{ddMenuSelected}}</p>
            <button dropdown-menu="ddMenuOptions" dropdown-model="ddMenuSelected" class="btn-menu">
                Menu
            </button>
            
            <h2>On a Div</h2>
            <p>And using a custom label field</p>
            <p>You have selected: {{ddMenuSelected2}}</p>
            <div style="cursor:pointer; width:100px; margin:0 auto;" dropdown-menu="ddMenuOptions2" dropdown-model="ddMenuSelected2" dropdown-item-label='name' class="">
                Menu
            </div>
            
            <h2>On an Anchor</h2>
            <p>You have selected: {{ddMenuSelected3}}</p>
            <a href='' style="width:100px; margin:0 auto;" dropdown-menu="ddMenuOptions3" dropdown-model="ddMenuSelected3" class="">
                Menu
            </a>
        </div>
    </div>
</body>