<div>
    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
        <input
            type="button"
            class="mdl-textfield__input"
            ng-click="$ctrl.onMouseDown($event)"
            ng-keydown="$ctrl.onKeyDown($event)"/>
        <div class="icons">
            <vn-icon
                ng-show="!$ctrl.disabled"
                icon="clear"
                class="clear"
                ng-click="$ctrl.onClearClick($event)"
                translate-attr="{title: 'Clear'}">
            </vn-icon>
        </div>
        <label class="mdl-textfield__label">
            <span translate>{{::$ctrl.label}}</span>
            <span translate ng-show="::$ctrl.required">(*)</span>
        </label> 
    </div>
</div>
<vn-drop-down
    vn-id="drop-down"
    on-select="$ctrl.onDropDownSelect(item)"
    on-data-ready="$ctrl.onDataReady()">
</vn-drop-down>