2016-11-25 3 views
0

У меня есть следующий код:Ионных Измены выпадающим Design

<label class="item item-input item-select"> 
    Country 
<select ng-options="country.name for country in countries" ng-model="country" ng-change="update(country)" > 
<option value="" style="display:none" disabled selected>{{countryPlaceholder}}</option> 
</select> 
</label> 

Но по телефону, когда выпадающий выбран. По-видимому, как это:

enter image description here

Как изменить цвет должен быть белым и синим, а не серый и белый?

ответ

1

Что отображается, есть внутренняя интерпретация выбора на конкретном устройстве (в данном случае Android-устройство). Браузер имеет предопределенный макет, отображаемый для элементов выбора html.

Если вы хотите его настроить, вы не сможете использовать элемент select. Я бы предложил реализовать директиву, реплицирующую поведение стандартного элемента select.

Я подготовил пример здесь: http://play.ionic.io/app/ca66596ef774

Конечно, это должен быть скорректирован (как вы хотите передать в различных вариантах и ​​прочее), но это в основном предназначены для транспортировки идеи. Он использует настраиваемую директиву, аналогичную выбранной (которую вы можете настроить в соответствии со стилем вашего приложения), и для отображения параметров используется служба $ ionicPopup.

Для всплывающего окна вы можете определить макет (я сделал это быстро в JS, вы также можете определить его в своем HTML и передать шаблонUrl в Popup), и вы можете настроить все элементы, как вы Пожалуйста.

Если у вас есть какие-либо вопросы, не стесняйтесь спрашивать.

Смежные вопросы