Structure data in items of list


I would like to display 4 different data in 1 single item in a list. Basically, on first line, the article name and in the right, its status. And in a second line, the location and in the right, the insert time. Below is my best attempt to do so, but the insert time is displayed below the location

	<ion-item *ngFor='let article of articles'>
		<h2>{{ article.code }} {{ }}</h2>
		<ion-badge item-end>{{ article.status }}</ion-badge>
		<p>{{ article.location }}</p>
		<ion-note right>{{ article.insert_time }}</ion-note>

If I use item-end instead of right, the insert time is moved beside the badge, not below the badge

Do you have any solution for this ?


Use ionic grid for this

Small example (may not work, but should get the point across

          <ion-col text-right>article.status</ion-col>
          <ion-col text-right>article.insert_time</ion-col>


(paragraph) makes a line break. see

As MattE said is ion-grid maybe a good solution for you.

Best regards, anna-liebt

Thanks for suggestion, looks good!