Ionic 2 select：選択したオプションを削除する

Question

フォームにイオン選択コンポーネントを使用していますが、問題が発生しました。ユーザーがオプションを1つ選択しても削除したい場合はオプションを指定しません。私は<ion-option>を空白の値で追加できますが、それはいいとは思いません。それを解決する良い方法はありますか？

EDIT： これは私の選択オプションが今どのように見えるかです：

ユーザーが一つの選択肢を選択し、彼の心を変更したいが、どのオプションを選択しない場合、それはかなり明確なようではありません彼がそれを行う方法。たとえ空白の値で「Remove Option」を追加しても、それはオプションのように見えますが、私にはうれしくありません。伝統的な選択では、テキストのない空白のオプションはかなり直感的です。しかし、この場合は、フッターの「Cancelar/Confirmar」オプションの近くにある「（X）Remove selected」のようなもの、あるいはそのようなものを考えていました。何か案は？ Ps：また、ion-optionは自分のオプションに置いたHTMLタグを取り除いているようだから、 "select none"オプションをフォーマットするのはかなり難しいです。

Answer 1

@ion-selectをもう一度クリックしてselect-nothingオプションを選択した場合、@ sonuの解決策はうまくいくが、それは楽しい経験ではない。 removeSelection()が変わる機能が

<ion-label>Options</ion-label> 
    <ion-select [(ngModel)]="option"> 
    <ion-option value="f">Female</ion-option> 
    <ion-option value="m">Male</ion-option> 
    </ion-select> 

    <div *ngIf="option=='m' || option=='f'"> 
    <ion-label> {{option}} </ion-label> 
    <ion-button (click)='removeSelection()'> 
     <ion-icon name='close'></ion-icon> 
    </ion-button> 
    </div> 

です：

あなたが欲しいものを得るための別の方法は、ユーザーがすでに何かを選択した場合のみ表示されている、あなたのion-selectの隣に小さなクリアボタンを使用することですおそらくthis.option=nullを設定して"No selection"に選択します。

もちろん、このボタンのスタイルを自由に変更できます。あなたはまた、イオンchipsを見たいかもしれません。特に、チップを削除することはあなたの意図を実現する一つの方法です。

Answer 2

オプションを空白の値にするのが良い方法です。コードイオンdocs

例のよう：

<ion-label>Gender</ion-label> 
    <ion-select [(ngModel)]="gender"> 
    <ion-option value="">Select Gender</ion-option> 
    <ion-option value="f">Female</ion-option> 
    <ion-option value="m">Male</ion-option> 
    </ion-select> 

それとも、明確な選択のための任意のイベントを追加することができます。