离子 - 如何将离子选择和离子日期时间放在离子项行中

Question

我想将离子选择和离子日期时间放在同一个离子项目中，如下所示：

<ion-item *ngFor="let column of columns">
            <ion-label floating>{{column.title}}</ion-label>
             <ion-select *ngIf="column.type=='customDate'"> 
                        <ion-option value="on">on</ion-option>
                        <ion-option value="onorbefore">on or before</ion-option>
                        <ion-option value="onorafter">on or after</ion-option>
                        <ion-option value="bewteen">between</ion-option>
                    </ion-select>
                    <ion-datetime *ngIf="column.type=='customDate'"  displayFormat="YYYY-MM-DD" ></ion-datetime>
                    <ion-datetime *ngIf="column.type=='customDate'"  displayFormat="YYYY-MM-DD" ></ion-datetime>

            <ion-input *ngIf="column.type=='text'" type="text"  [(ngModel)]="filterValues[column.id]"></ion-input>
        </ion-item>

逻辑是，如果列类型为 customDate，则显示下拉选择和两个日期时间选取器。根据用户选择的日期类型，第二个日期时间选取器将被隐藏。

现在的问题是，如果我使用上面的代码，那么我只能看到 dateTime 组件。日期类型下拉列表选择不再存在。我在 Web 控制台中查看了源代码，下拉日期类型选择为空。

使用离子项组件是否有任何限制？ 为什么不能在同一离子项行中同时显示这三个组件？

谢谢

Answer 1

你可以试试这个

<ion-list>
 <ion-row>
  <ion-col ion-item col-6>
     <ion-select></ion-select>
  </ion-col>
  <ion-col ion-item col-6>
     <ion-datetime></ion-datetime>
  </ion-col>
 </ion-row>
</ion-list>