javascript - Nativescript ListView [object 对象]

Question

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

JSON response

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

Controller

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!
    });

};

Template

<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>

Result

Answer 1

这里的问题是您需要将模板包装在 View 容器中，例如 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>