ios - Ionic 3:无法滚动 ion-list overflow-y 用于使用 ngFor 在 ion-list 内部生成 ion-items 的 iOS 设备
问题描述
使用 ionic v3 开发混合应用程序,我在使用 *ngFor 生成的 ion-list 中有 ion-items。问题出在 iOS 设备上,即我无法滚动在 y 方向上溢出的 ion-list。但安卓设备没有这样的问题。
下面是HTML代码
<ion-list class="scroll-content">
<ion-item *ngFor="let diaryEvent of diaryEvents">
<h2>{{ diaryEvent.title || "None" }}</h2>
<h3>{{ moment(diaryEvent.day).format("YYYY-MM-DD") }}</h3>
<p>{{ diaryEvent.notes }}</p>
<p>
<ion-icon *ngIf="diaryEvent.videoFilePath" name="videocam" (click)="eventPopup($event, diaryEvent)"></ion-icon>
<ion-icon *ngIf="diaryEvent.audioFilePath" name="mic" (click)="eventPopup($event, diaryEvent)"></ion-icon>
</p>
<span (click)="viewDiaryEvent(diaryEvent)">
<u>View</u>
<ion-icon name="eye"></ion-icon>
</span>
<span (click)="editEvent(diaryEvent)">
<u>Edit</u>
<ion-icon name="create" ></ion-icon>
</span>
</ion-item>
下面是CSS
.scroll-content{
overflow-y:scroll !important;
height:88vh;
}
我希望该应用程序能够平滑滚动,因为它是 android 设备的默认设置。
如果有人有解决问题的方法,请帮助我。我已经为这个问题努力了三天。将不胜感激获得解决方案。
抱歉,如果在提问方式或我的英语方面有任何错误,因为这是我在这里的第一个问题。
谢谢你。
解决方案
您应该将列表放入<ion-content>
元素中并删除您的 css 类。该组件将处理滚动,并使您能够在需要时跟踪事件。
推荐阅读
- python - python和c++对象的内存地址不相同
- javafx - 如何在单个 javafx 模板中的不同坐标处绘制 100 个二维形状(如圆形)?
- c# - 算子的预增量
- python - 如何修改满足条件的值下一行的值?
- python-3.x - 无法将时间序列图更改为每小时间隔
- jms - JCA JMS 和普通 JMS 有什么区别
- assembly - 为什么堆栈上参数的顺序是这样的顺序,即第一个参数位于最低地址,第二个位于第二低地址,依此类推
- javascript - 复选框选中或取消选中值 null
- python - 为什么 keras model.predict 只返回一个概率?如何输出所有类的所有概率?
- php - 这个电子邮件功能有问题吗?