2017-06-29 11 views
2

イオンカード内にイオン選択を表示しないイオン2を使用しています。以下のコードを参照してください。イオン2イオン選択イオンカードでは機能しません

<ion-content> 
    <ion-list> 
    <ion-item> 
     <ion-card> 
      <ion-label>Quantity</ion-label> 
      <ion-select> 
      <ion-option value="nes">0</ion-option> 
      <ion-option value="n64">1</ion-option> 
      <ion-option value="ps">2</ion-option> 
      <ion-option value="genesis">3</ion-option> 
      <ion-option value="saturn">More</ion-option> 
      </ion-select> 
     </ion-card> 
    </ion-item> 
    </ion-list> 
</ion-content> 

イオンカードを取り外すと、すべて正常に動作します。これはionic 2のバグですか、何か不足していますか?

答えて

2

の内側にあなたのコードの問題はion-cardコンポーネントがion-itemの内側に行くべきではないということです。あなたがthis working plunkerで見ることができるように、あなたはそれを動作させるために、このようにそれを変更することができます。

<ion-content> 

    <ion-card> 
    <ion-item> 
     <ion-label>Quantity</ion-label> 
     <ion-select> 
     <ion-option value="nes">0</ion-option> 
     <ion-option value="n64">1</ion-option> 
     <ion-option value="ps">2</ion-option> 
     <ion-option value="genesis">3</ion-option> 
     <ion-option value="saturn">More</ion-option> 
     </ion-select> 
    </ion-item> 
    </ion-card> 

</ion-content> 

も、私はラベルとion-itemの内側に選択要素を配置したことに注意してください。

0

トライカード内容<ion-card-content></ion-card-content>

<ion-content> 
     <ion-list> 
     <ion-item> 
      <ion-card> 
       <ion-label>Quantity</ion-label> 
       <ion-card-content> 
       <ion-select> 
       <ion-option value="nes">0</ion-option> 
       <ion-option value="n64">1</ion-option> 
       <ion-option value="ps">2</ion-option> 
       <ion-option value="genesis">3</ion-option> 
       <ion-option value="saturn">More</ion-option> 
       </ion-select> 
      <ion-card-content> 
      </ion-card> 
     </ion-item> 
     </ion-list> 
    </ion-content> 
関連する問題