本机脚本转发器绑定问题 - 垂直显示 [对象对象]



我有一个使用NativeScript 2.1.0,Angular 2.0.0.rc3和TypeScript 1.8.10的小型测试应用程序设置。我正在Windows上的Android 5.1.1模拟器中运行该项目。

我有一个 ListView 工作,但现在我正在尝试使用以 XML 声明的中继器获取相同的数据输出。我没有获得数据输出,而是看到类似[对象,对象]的东西垂直显示在屏幕中央。

请注意,我的数据数组不是可观察的。它目前是一个对象的 Typescript 数组。

我没有收到任何错误消息。一切都编译和运行,没有错误。

这是我的中继器代码。我做错了什么?

<GridLayout rows="*">
    <!-- this code doesn't work, produces [Object object], in middle of screen -->
    <Repeater items="{{ personList }}" row="1">
        <Repeater.itemsLayout>
            <StackLayout orientation="horizontal"></StackLayout>
        </Repeater.itemsLayout>
        <Repeater.itemTemplate>
                <Label text="{{ FirstName }}" class="medium-spacing"></Label>
        </Repeater.itemTemplate>
    </Repeater>
    <!-- This Code Works
    <ListView [items]="personList" row="1">
        <template let-item="item">
            <GridLayout row="0" columns="80,80">
                <Label col="0" [text]="item.FirstName"></Label>
                <Label col="1" [text]="item.LastName"></Label>
            </GridLayout>
        </template>
    </ListView>
    -->
    <ActivityIndicator [busy]="isLoading" [visibility]="isLoading ? 'visible' : 'collapse'" row="1" horizontalAlignment="center"
        verticalAlignment="center"></ActivityIndicator>
</GridLayout>

在中继器中,您使用的是 NativeScript Core 数据绑定语法,如下所述: https://docs.nativescript.org/core-concepts/bindings#binding-in-xml

但是,当使用nativeScript + Angular-2时,绑定语法是不同的(角度语法),如下所述 https://docs.nativescript.org/angular/core-concepts/DataBinding.html:

这就是列表视图绑定正常工作且转发器绑定未产生预期结果的原因。

编辑:中继器不会像这里讨论的那样工作(对于NativeScript + Angular-2,你可以使用*ngFor代替)

有关 NativeScript + Angluar-2 中的列表视图绑定的更多信息,请访问:https://docs.nativescript.org/angular/ui/list-view.html#list-view

最新更新