Ion tag does not display all text in Ionic2

Question

I use an ionic label inside the ionic element, but the description is not displayed (instead, it shows the exact point ....) I want it to display all the text. Is there any solution?

<ion-card *ngFor="let product of products">
    <img [src]="product.imageURL" />
    <ion-card-content>
        <ion-card-title primary [innerHTML]="product.title"></ion-card-title>
        <ion-item class="item-text-wrap">
        <ion-item>
            <ion-label primary>Description</ion-label>
            <ion-label [innerHTML]="product.description"></ion-label>
        </ion-item>
    </ion-card-content>
</ion-card>

Answer 1

UPDATE

You can also set the attribute text-wrapto ion-card, like this

<ion-card text-wrap *ngFor="let product of products">
...
</ion-card>

Bonus tip: if you put text-wrap(as an attribute, not as a class) in ion-list, all the elements in this list will have an effect text-wrap. This way, you don’t need to put the attribute text-wrapin all elements, and this will help you optimize your application slightly.

---

:

ion-textarea (), . ion-textarea .

<ion-card *ngFor="let product of products">
    <img [src]="product.imageURL" />
    <ion-card-content>
        <ion-card-title primary>{{ product.title }}</ion-card-title>
        <ion-item>
            <ion-label primary>Description</ion-label>
            <ion-textarea rows="6" disabled [value]="product.description"></ion-textarea>
        </ion-item>
    </ion-card-content>
</ion-card>

rows , , , . disable, ion-textarea label, . , : value .

:

• ion-item,

  <ion-item class="item-text-wrap">
          <ion-item>
          <!-- ... -->
  </ion-item>
  

• [innerHTML]

  <ion-card-title primary>{{ product.title }}</ion-card-title>