Ionic2 two ion-datetime рядом друг с другом

Question

Итак, у меня есть страница, содержащая ионный контент, в котором содержится ионный список.

ионный список содержит ионные предметы. Это контейнер для элементов, таких как вход, метка и т. Д.

Я сделал (очень уродливое) изображение, которое представляет собой то, что я хочу выполнить.

Это код, который работает, чтобы получить 2 метки рядом друг с другом, как на картинке выше (синий секций).

<ion-item> 
    <ion-label>Label 1</ion-label> 
    <ion-label>Label 2</ion-label> 
    </ion-item> 

Теперь я хочу, чтобы получить 2 ионным даты-времени элементы рядом друг с другом, так что я попробовал это.

<ion-item> 
    <ion-datetime></ion-datetime> 
    <ion-datetime></ion-datetime> 
    </ion-item> 

Это результат.

В этом примере нет коды для предоставления данных, чтобы показать в элементах ионной даты и времени, но в моем проекте есть.

Кто-нибудь знает, как я могу заставить это работать?

Ниже приведен пример, как заставить его работать. Мы решили, что это ошибка, поэтому я сообщил об этом здесь https://github.com/driftyco/ionic/issues/9818.

Answer 1

Вы можете использовать ion-row и ion-col элементы для достижения этой компоновки (или что-то подобное, по крайней мере):

<ion-list> 
    <ion-row> 
     <ion-col> 
     <ion-item> 
      <ion-label>Label 1</ion-label> 
     </ion-item> 
     </ion-col> 
     <ion-col> 
     <ion-item> 
      <ion-label>Label 2</ion-label> 
     </ion-item> 
     </ion-col> 
    </ion-row> 
    <ion-row> 
     <ion-col> 
     <ion-item> 
      <ion-datetime [(ngModel)]="startDate"></ion-datetime> 
     </ion-item> 
     </ion-col> 
     <ion-col> 
     <ion-item> 
      <ion-datetime [(ngModel)]="endDate"></ion-datetime> 
     </ion-item> 
     </ion-col> 
    </ion-row> 
    </ion-list> 

Хотя я не уверен, если это правильный выбор в контексте вашего приложения ,