离子更改默认下拉设计

Question

我有以下代码：

<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> 

但在手机上，在下拉选择。这似乎是这样的：

如何改变颜色为白色和蓝色，而不是灰色和白色的？

Answer 1

显示的内容是在特定设备（本例中为Android设备）上选择的本地解释。浏览器具有为html选择元素显示的预定义布局。

如果你想自定义它，你不能使用select元素。我建议实现一个复制标准select元素行为的指令。

我准备了一个例子就在这里：http://play.ionic.io/app/ca66596ef774

当然这必须进行调整（如你想在不同的选项和东西通过），但它主要是指输送的想法。它使用类似于select的自定义指令（您可以自定义以匹配应用程序的样式）以及显示选项，使用$ ionicPopup服务。

对于弹出窗口，你可以定义一个布局（我已经在JS中做了快速的方法，你也可以在你的HTML中定义它，并将templateUrl传递给Popup），你可以调整所有元素请。

如果您有任何问题请不要犹豫，问。