Search code examples
javascriptangularjsangular-strap

How to disable the dropdown menu of select when the select only has one item

I'm using 'select' widget from angularstrap.

I'm wondering how to prevent the dropdown menu for the select only having one item. The only one item has been selected by default, how to prevent the click event on select to show the dropdown menu?

Is it a missing feature of angularstrap?

Check the Single select in example

Solution

  • It's not angularstrap feature, but you can use attributes like ng-hide, ng-show or ng-if to hide specific <div> element when your select has only one item.

    UPDATE: According to your example, change your Single select section:

    <label>Single select:&nbsp;</label>
<button ng-if="icons.length > 1" type="button" class="btn btn-default" ng-model="selectedIcon" data-html="1" bs-options="icon.value as icon.label for icon in icons" bs-select>
  Action <span class="caret"></span>
</button>
<button ng-if="icons.length === 1" type="button" class="btn btn-default" ng-model="selectedIcon" data-html="1">
  {{icons[0].value}}
</button>

    I can't add gear icon, but I hope it's easy fix ;)