角度 – Ionic2两个离子日期时间彼此相邻

2019年7月20日 220次阅读

所以,我有一个包含离子含量的页面,其中包含一个离子列表.

离子列表包含离子项.这是一个容器,用于输入,标签等元素.

我做了一个(非常难看)的图像,代表了我想要完成的事情.

《角度 – Ionic2两个离子日期时间彼此相邻》

This is code that works to get the 2 labels next to each other like the picture above (blue sections).

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

Now I want to get 2 ion-datetime elements next to each other, so I tried this.

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

这是结果.

《角度 – Ionic2两个离子日期时间彼此相邻》

对于此示例,没有代码提供要在ion-datetime元素中显示的数据,但在我的项目中有.

有谁知道我怎么能让这个工作？

Below is an example how to get it working. We figured it’s a bug so I reported it here 07002.

最佳答案 您可以使用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>

虽然我不确定这是否是您应用上下文中的有效选项.

点赞