如何使用 RadListView 创建每行两列的网格视图

Question

我认为这很容易，但不幸的是，我找不到任何答案。 我安装了telerik-ui，并想使用RadListView。从文档中，我可以看到具有完美布局的演示页面，每行有多个项目。就我而言，我想每行有两列，然后显示列表视图。下面是我的xml代码，但它完全是空白的，我不知道为什么。你能帮忙吗？

这是我的 XML 中的代码：

<RadListView [items]="flattenDishes">
<ListViewLinearLayout scrollDirection="Vertical" itemHeight="500" spanCount="2"></ListViewLinearLayout>
<ng-template tkListItemTemplate let-flattenDish="item">
<GridLayout rows="auto" columns="auto, *">
<StackLayout orientation="vertical">
<Image [src]="serverUrl +'images/' +  flattenDish.get('option_imageUrl') " stretch="aspectFill" width=200 height=200></Image>
<Label  [text]="flattenDish.get('option_size')+':'+ flattenDish.getTrans('zh').get('title')"></Label>
<Label  [text]="flattenDish.get('option_price')"></Label>
</StackLayout>
</GridLayout>
</ng-template>
</RadListView>

谁能帮我在这里有一个工作模板？

谢谢

Answer 1

试试这个，不是使用RadListView，但重要的部分在项目内部：

<ListView class="list-group" [items]="workOrders" (itemTap)="onItemTapSecondList($event)" separatorColor="gray">
<ng-template let-workOrder="item">
<StackLayout orientation="horizontal">
<StackLayout>
<Label text="Order ref:" class="order-id-label"></Label>
</StackLayout>
<StackLayout>
<Label text="Order date:" class="order-id-label"></Label>
</StackLayout>
</StackLAyout>
</ng-template>
</ListView>