Inserting multiple RadListViews does not show on iOS - ios

Question

I need Multiple RadListViews on the same page, I'm using NativeScript Angular
I don't know the number of items in each list, and the items might be of very different size depending on the amount of text the item contains.
So to speak, I need three RadLists on top of each other - the first might have 3 items, the next 72 and the last 9 items.
I want each list to take op the height its contents demands, so I can show them on top of each other, no matter how long they are.
On Android it works like a charm - each radlistview takes up in exactly the height needed to show its items and produces the next radlistview right after
On iOS, on the other hand, it's very different - if I do not set the height of the RadListView itself it simply does not show.
I have the two RadListViews living inside a GridLayout, and giving the rows an absolute value like row="150, 150" or even rows="*,*" will show as much of the list as the provided values permits - but I need it to be rows="auto, auto" as I have no idea how high each list is gonna be, and I want to show all the items.
Setting the height directly on the RadListView will also work, but again - I don't know the height.
Setting height="100%" directly on the RadListView does not solve my problem as I cannot have an absolute parent height.
So is this possible at all, or do I have to calculate a number for the height property (which I really really don't want to do)
Again... the problem only exists on iOS devices.
I have tried feeding the dataItem both as ObservableArray and as a plain array of objects type: name[], because I thought that the asynchronicity of the ObservableArray might have a role to play, but it does not matter - I can even fill the text property with a constant like instead of . Still, if no height is set on either the row or the RadListView itself - nothing will show up.
Regards Per
<GridLayout rows="auto, auto'>
<RadListView [items]=" dataItems">
<ng-template tkListItemTemplate let-item="item">
<StackLayout orientation="vertical">
<Label [text]="item.firstname"></Label>
<Label [text]="item.lastname"></Label>
</StackLayout>
</ng-template>
</RadListView>
<RadListView [items]="dataItems">
<ng-template tkListItemTemplate let-item="item">
<StackLayout orientation="vertical">
<Label [text]="item.firstname"></Label>
<Label [text]="item.lastname"></Label>
</StackLayout>
</ng-template>
</RadListView>
</GridLayout>

Answer 1

I have created a playground for you here. When you are using a GridLayout, you need to assign row to RadListView.
<GridLayout rows="auto, auto'>
<RadListView row="0" [items]=" dataItems">
<ng-template tkListItemTemplate let-item="item">
<StackLayout orientation="vertical">
<Label [text]="item.firstname"></Label>
<Label [text]="item.lastname"></Label>
</StackLayout>
</ng-template>
</RadListView>
<RadListView row="1" [items]="dataItems">
<ng-template tkListItemTemplate let-item="item">
<StackLayout orientation="vertical">
<Label [text]="item.firstname"></Label>
<Label [text]="item.lastname"></Label>
</StackLayout>
</ng-template>
</RadListView>
</GridLayout>