2016-11-25 5 views
0

私は次のコードを持っている: イオンの変更デフォルトのドロップダウン設計

<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デバイス)のselectに対するネイティブな解釈です。ブラウザにはhtml select要素用に事前定義されたレイアウトが表示されます。

これをカスタマイズしたい場合は、select要素を使用することはできません。標準のselect要素の動作を複製するディレクティブを実装することをお勧めします。

私は右ここでは例を準備:http://play.ionic.io/app/ca66596ef774

は確かにこれは(あなたが異なるオプションとスタッフに渡したいと)調整しなければならないが、主にアイデアを輸送するためのものです。 select(これはあなたのアプリのスタイルに合わせてカスタマイズすることができます)と同様に表示されるカスタムディレクティブを使用し、オプションを表示するために$ ionicPopupサービスが使用されます。

ポップアップの場合、レイアウトを定義することができます(私はJSですばやく行いました。HTMLで定義し、templateUrlをポップアップに渡すこともできます)。すべての要素を調整できますお願いします。

ご不明な点がございましたら、お気軽にお問い合わせください。

関連する問題