Angular ui select not showing placeholder

Question

I have a problem with angular-ui-select.

When it's closed it looks like this

But when it's opened the placeholder doesn't show up and it looks like this:

This is my code:

<ui-select ng-model="selected.address" style="width: 50%;">
  <ui-select-match>
    <span ng-bind="$select.selected.description"></span>
  </ui-select-match>
  <ion-list ui-select-choices refresh="getPlaces()" refresh-delay="10" repeat="item in places track by item.id">
    <ion-item class="item-icon-left">
      <i class="icon icon-left ion-android-compass"></i>
      <h3 ng-bind="item.address"></h3>
    </ion-item>
  </ion-list>
</ui-select>

Note 1: I get my data from a server and there could be a lot of fields to display.

Note 2: I'm using the 'selectize' theme because I can't use Bootstrap in my Ionic app

Do you have any suggestions of why this is happening and how to fix it?

EDIT : The "activities label in the second image is there because the dropdown goes over the next field, no big deal here.

No problem at all :) Nothing wrong with the original but just easier for people to see the problem and hopefully more answers will come when the pictures are straight in the question etc :) — thepio, Jul 12 '16 at 15:27
yeah I can't put image directly because i don't have enough reputation score — Mattia Pettenuzzo, Jul 12 '16 at 15:32
Oh, that requires rep? Haha I didn't know that...well then :) — thepio, Jul 12 '16 at 18:42

score 0 · Answer 1 · answered Aug 23 '17 at 22:07

0

You need to turn on enableSearch. That should turn the placeholder on.

$scope.enableSearch = function () {
        $scope.searchEnabled = true;
    };

answered Aug 23 '17 at 22:07

Mahib

3,977
5
53
62

Angular ui select not showing placeholder

1 Answers1