Блог

Главная - Вопросы по программированию - параметры ion-item- не отображаются

параметры ion-item- не отображаются

#ionic-framework #ionic3

#ionic-framework #ionic3

Вопрос:

Я разрабатываю приложение с использованием Ionic 3. У меня есть ion-item-sliding, заключенный в ion-list. Мне нужно показывать параметры при пролистывании элемента списка. У меня работает цвет, но текст вообще не отображается. У меня вообще нет никакого css, примененного к кнопке.

 <ion-list text-wrap>
      <ion-list-header>
        ...
      </ion-list-header>
      <ion-item *ngIf="classes?.length === 0">No Data</ion-item>
      <ion-item-group *ngFor="let classObj of classes">
        <ion-item-divider>...</ion-item-divider>
        <ion-item-sliding *ngFor="let class of classObj?.classes">
          <ion-item *ngFor="let class of classObj?.classes">
            <ion-grid>
              ...
            </ion-grid>
          </ion-item>
          <ion-item-options side="right">
            <button ion-button color="secondary">
              Change
            </button>
          </ion-item-options>
        </ion-item-sliding>
      </ion-item-group>
    </ion-list>

введите описание изображения здесь

Я понятия не имею, что пошло не так. Это произошло как с Android, так и с iOS

Комментарии:

1. Будет ли это отображаться, если вы удалите цвет?

2. нет. Это то же самое. Я даже пытался применить style="color: 'red'" к кнопке, но она не работает

3. Можете ли вы выполнить в терминале ionic info Я думаю, что вы используете ionic 4

4. Я понимаю это ionic (Ionic CLI) : 4.9.0 (/usr/local/lib/node_modules/ionic) Ionic Framework : ionic-angular 3.9.2 @ionic/app-scripts : 3.1.10

5. Попробуйте добавить его в ion-label

Ответ №1:

Все в порядке, я нашел решение. Я ошибочно *ngFor оба ion-item-sliding и ion-item , следовательно, ползунок ломается. Я удалил *ngFor в ion-item , и теперь все работает нормально

Ответ №2:

Я думаю, вам нужно предоставить небольшую кнопку отмены рядом с вашим ion-select, которая появляется только тогда, когда пользователь уже что-то выбрал:

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