2017-02-03 12 views
5

W dokumentach Ionic2 są całkiem niezłe przykłady wejściowe, ale ktoś próbował stworzyć normalną etykietę (nie pływającą lub taką) z danymi wejściowymi ORAZ ikoną po lewej stronie etykiety?Ionic 2: Wejście z Icon-Label

Myślałem, że może ona iść tak:

<ion-item> 
     <ion-icon name="logo-playstation"></ion-icon> 
     <ion-label>PSN</ion-label> 
     <ion-input clearInput type="text"></ion-input> 
</ion-item> 

ale ikona nie apper. Czy powinienem używać do tego celu <div> lub jak to zrobiłeś/zrobiłeś?

Odpowiedz

22

Musisz użyć jonowy-jonowy ikony wewnątrz-label

<ion-item>   
     <ion-label> <ion-icon name="logo-playstation"></ion-icon> PSN</ion-label> 
     <ion-input clearInput type="text"></ion-input> 
</ion-item> 
+0

Wygląda świetnie! Dzięki =) –

0

musiałem użyć elementu wejściowego i ikona w oddzielnych polach rzędzie .. w tabeli .. w kol jonowej. i w rzędzie jonowym.

<ion-row> 
     <ion-col col-auto> 
      <table> 
       <tr> 
        <td> 
         <ion-icon name="logo-playstation"></ion-icon> 
        </td> 
        <td> 
         <ion-input clearInput type="text"></ion-input> 
        </td> 
       </tr> 
      </table> 
     </ion-col> 
    </ion-row> 
Powiązane problemy