我目前正在开发Ionic Cordova移动应用程序,并且使用ion-scroll属性以使列表可滚动。不幸的是,即使列表内部的表也可以滚动。有什么办法可以禁用此功能?我只希望列表本身可滚动而不是单个单元格中的表格。
.collection-container {
width: 150%;
margin-left: -15.7px;
padding-top: 4px;
background-color: white;
height: 100%;
.button {
font-size: 24px;
margin: 0px;
height: 28px;
padding: 0px 5px;
}
.item {
border-bottom: 0.55px solid color($colors, border);
background-color: lightskyblue !important;
height: 100px;
}
ion-scroll {
margin-left: -17px;
margin-top: -9.5px;
width: 200%;
}
th {
float: left;
color: rgb(4, 38, 150);
}
td {
float: right;
color: rgb(4, 38, 150);
}
.checkbox {
float: left;
margin: 35px;
margin-left: 8px;
}
<div class="collection-container">
<ion-scroll style="width:100%;height:90vh" scrollY="true">
<ion-list class="dataList" scroll="true">
<ion-content class="item" *ngFor="let item of collection">
<ion-checkbox class="checkbox"></ion-checkbox>
<table class="dataDisplay">
<tr>
<th>NAME OF MOTHER: </th>
<td>{{ item.nameMother }}</td>
</tr>
<tr>
<th>NAME OF CHILD: </th>
<td>{{ item.nameChild }}</td>
</tr>
<tr>
<th>DATE OF BIRTH (MM/DD/YYYY):</th>
<td>{{ item.birthDate | date }}</td>
</tr>
<tr>
<th>FORM COMPLETE: </th>
<td>{{ item.Form }}</td>
</tr>
<tr>
<th>Countdown: </th>
<td><strong>{{ item.countdown }}</strong></td>
</tr>
</table>
</ion-content>
</ion-list>
</ion-scroll>
</div>