Question

我正在尝试使用转发器来显示json数据。但结果并不像我想要的那样。我想要的是在Value之后显示Item。在该项目全部显示之后，不显示全部值。

这是page.bindingContext：

Lua 5.3.0  Copyright (C) 1994-2014 Lua.org, PUC-Rio
> str = 'hello' .. ' Lua'
> str
hello Lua
> 1 + 2
3
>

这是xml模板：

page.bindingContext = {
"myItems": [
    {
        "value": "100",
        "item": "Car"
    },
    {
        "value": "200",
        "item": "Motor"
    },
    {
        "value": "300",
        "item": "Boat"
    }
]
};

结果是：

Answer 1

如何使用Repeater一次，并打印两个项目？

已编辑：已添加方向=“水平”

<ScrollView>
  <StackLayout cssClass="bodyPilihProduk">

  <Repeater items="{{ myItems }}" >
     <Repeater.itemTemplate orientation="horizontal">
        <Label text="{{ item }}" margin="10" style="font-size:20;"/>
        <Label text="{{value}}" margin="10" style="font-size:12;"/>
     </Repeater.itemTemplate>
  </Repeater>

  </StackLayout>
</ScrollView>

现在您可以显示项目和值。

的iOS

的Android

Answer 2

使用一（1）个转发器并在其中打印两个标签。由于你有两个项目，你需要将它们包装在某种layout中。要只打印彼此，使用orientation="horizontal"的StackLayout就足够了。

<ScrollView>
    <Repeater items="{{ myItems }}">
        <Repeater.itemTemplate>
            <StackLayout orientation="horizontal">
                <Label text="{{ item }}" />
                <Label text="{{ value }}" />
            </StackLayout>
        </Repeater.itemTemplate>
    </Repeater>
</ScrollView>

任何layout都可以使用，这里有一个使用GridLayout的示例，它会为您提供更多的表格外观，其中包含两列，第一列中的项目和第二列中的值。

<ScrollView>
    <Repeater items="{{ myItems }}">
        <Repeater.itemTemplate>
            <GridLayout columns="4*, 1*">
                <Label col="0" text="{{ item }}" />
                <Label col="1" text="{{ value }}" />
            </GridLayout>
        </Repeater.itemTemplate>
    </Repeater>
</ScrollView>

Nativescript使用repeater多个键值

2 个答案: