关于ionic框架：ion-item-options不显示


ion-item-options not displaying

我正在使用Ionic 3开发应用程序。我在离子列表中包裹了一个可滑动离子项目的窗口。 刷列表项时，我需要显示选项。 我可以使用颜色，但是文本根本不显示。 我根本没有将任何CSS应用于按钮。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<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>

enter image description here

我不知道出了什么问题。 Android和iOS都发生了这种情况

相关讨论

好的，我已经找到了解决方案。 我错误地同时ion-item-sliding和ion-item *ngFor，因此滑块断开。 我在ion-item中删除了*ngFor，现在一切正常

我认为您必须在"离子选择"旁边提供一个小的"取消"按钮，该按钮仅在用户已经选择某项时出现：

1
2
3
4
5
6
7
8
9
10
11
<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>


<ion-label> {{option}} </ion-label>
<ion-button  (click)='removeSelection()'>
   <ion-icon name='close'></ion-icon>
</ion-button>