Nativescript ListView [对象对象]答案

【问题标题】：Nativescript ListView [object Object]Nativescript ListView [对象对象]
【发布时间】：2017-08-23 14:27:35
【问题描述】：

我是Nativescript 的新手，我正在尝试将ListView 与香草javascript 一起使用。我有一个奇怪的错误，ListViews 中的输出显示为[object Object] 而不是实际值。

JSON 响应

[
    {
        passenger: "John Doe",
        category: "Arrival"
    },
    {
        passenger: "Martin Schulz",
        category: "Departure"
    },
    {
        passenger: "Giovanni Marocco",
        category: "Arrival"
    }
]

控制器

var view = require("ui/core/view");
var http = require("http");

exports.pageLoaded = function(args) {
    var page = args.object;

    http.getJSON("http://demo4727937.mockable.io/test").then(function (r) {
        page.bindingContext = {
            'myItems': r
        }
    }, function (e) {
        //// Argument (e) is Error!
    });

};

模板

<Page loaded="pageLoaded">
    <StackLayout>
        <ListView items="{{ myItems }}">
            <ListView.itemTemplate height="50">
               <Label text="{{passenger}}" textWrap="true" class="title" />
               <Label text="{{category}}" textWrap="true" class="title" />
            </ListView.itemTemplate>
         </ListView>
    </StackLayout>
</Page>

结果

【问题讨论】：

您需要将标签包装在容器中，例如
感谢@OseiFortune，它有效。请考虑将此作为答案发布，以便我接受它

标签： javascript android nativescript

【解决方案1】：

这里的问题是您需要将模板包装在视图容器中，例如 StackLayout 甚至是 GridLayout

<Page loaded="pageLoaded">
    <StackLayout>
        <ListView items="{{ myItems }}">
            <ListView.itemTemplate height="50">
                <StackLayout>
                    <Label text="{{passenger}}" textWrap="true" class="title" />
                    <Label text="{{category}}" textWrap="true" class="title" />
                </StackLayout>
            </ListView.itemTemplate>
        </ListView>
    </StackLayout>
</Page>

【讨论】：