Question

我想将ion-select和ion-datetime放在同一个离子项中，如下所示：

<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，则显示下拉选择和两个日期时间选择器。根据用户选择的dateType，将隐藏第二个dateTime选择器。

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

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

由于

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>

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

1 个答案: