/ / Ionic2 2つのイオン - 日付時刻が隣同士 - 角度、タイプスクリプト、イオン2、イオン3

Ionic2 2つのイオン - 日時 - 角度、タイプスクリプト、イオン2、イオン3

だから、私は "イオン含有量を含むページを得た"これはイオンリストを含みます。

イオンリストにはイオン項目が含まれています。これは入力、ラベルなどのような要素のためのコンテナです。

私が達成したいことを表す(非常に醜い)画像を作りました。

私が望むもの

これは、上の図のように2つのラベルを隣接させるためのコードです(青いセクション)。

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

今度は2つのion-datetime要素を並べて表示したいので、これを試しました。

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

これが結果です。

結果

この例では、ion-datetime要素に表示するデータを提供するコードはありませんが、私のプロジェクトにはあります。

誰もが私がこれを機能させる方法を知っていますか?

以下は動作させる方法の例です。私たちはそれをバグだと思ったので、ここで報告しました https://github.com/driftyco/ionic/issues/9818.

回答:

回答№1は2

あなたは使うことができます 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>

これがあなたのアプリのコンテキストで有効なオプションであるかどうかはわかりませんが。