ionische - wie Ionen wählen und Ionendatumzeit zusammen in Ionenartikelzeile setzen

Question

Ich möchte wie unten Ionen wählen und Ionendatetime zusammen in der gleichen Ionen Artikel setzen:

<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> 

Die Logik ist, wenn der Spaltentyp customDate ist, dann dropdown select und zwei datetime-Picker anzeigen. Basierend auf dem vom Benutzer ausgewählten dateType wird der zweite dateTime-Picker ausgeblendet.

Jetzt ist das Problem, wenn ich obigen Code verwende, dann kann ich nur die dateTime Komponente sehen. Die Dropdown-Liste dateType ist nicht mehr vorhanden. Ich schaute auf den Quellcode in der Webkonsole, das Dropdown-dateType select ist leer.

Gibt es Einschränkungen für die Verwendung der Ion-Item-Komponente? Warum kannst du nicht alle drei zusammen in derselben Ionen-Item-Reihe anzeigen?

Dank

Answer 1

können Sie versuchen, diese

<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>