All geek questions in one place

Ionic 2: input with a tag icon

Ionic2 documentation has some pretty nice input examples, but did someone try to create a normal label (not floating or so) with input AND the icon to the left of the label?

I thought this could go like this:

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

but the icon does not fit. Should I use a <div> for this, or how would I do / would it?

+5
source share
2 answers

You need to use the ionic icon inside the ionic label

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

I had to use the icon and input element in separate fields of the row .. inside the table .. inside the ion column and inside the ion row.

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

Source: https://habr.com/ru/post/1263771/

More articles:


All Articles