javascript - ListView 中的 Observable 错误地绑定(bind)了元素

标签 javascript android nativescript

在我的 NativeScript 应用程序中有一个 ListView。我想将 Observable 对象数组绑定(bind)到它以单独修改每个项目。然而,NativeScript 似乎为每个 ListView 项目绑定(bind)相同的单个项目(绑定(bind)数组的最后一个项目)

这是我的布局:

<Page loaded="onPageLoaded">
    <StackLayout orientation="vertical">
            <ListView items="{{items}}">
                    <ListView.itemTemplate>
                            <Label text="{{name}}" />
                    </ListView.itemTemplate>
            </ListView>
    </StackLayout>
</Page>

ViewModel 是这样的:

var observableModule = require("data/observable");
var observableArray = require("data/observable-array");
var viewModule = require("ui/core/view");

var items =  [
    new observableModule.Observable({name:"Item 1"}),
    new observableModule.Observable({name:"Item 2"})
];

var pageData = new observableModule.Observable();
var page;

exports.onPageLoaded = function(args) {
    page = args.object;
    pageData.set("items",items);
    page.bindingContext = pageData;
};

我希望ListView显示“Item 1”和“Item 2”,但它显示“Item 2”,“Item 2”。您可以在此屏幕截图中看到问题:

Screenshot of the problem

顺便说一句,当前目标是 Android。

最佳答案

问题在于 NativeScript 的 Observable 类定义属性的方式(它们引用闭包中保存的“this”的副本,并在构造函数中重新定义属性,因此它们最终都引用最后一个对象的值) 。 data/observable/observable.ts 中对 that 的引用应更改为 this(已安装版本中的 data/observable/observable.js)。我创建了一个pull request随着变化。

关于javascript - ListView 中的 Observable 错误地绑定(bind)了元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31898061/

相关文章:

javascript - Gmaps4rails Gem 显示同一地址的 2 个标记

android - tns-platform-declarations 的 nativescript-carousel 错误

vue.js - Nativescript-Vue:如何在 ListView 中正确使用 v-for

AndroidX 突然导致 NativeScript 构建失败

android - 是在 onActivityCreated() 之前还是之后调用 onDraw()?

android - 如何在android中使用adb恢复出厂设置?

javascript - 使用 ReactJS 通过 Prop 将函数传递给子组件

javascript - GA GEO 图表城市标记不正确

javascript - Ember : click event on a view not firing

android - 如何在Android版MonoGame上播放声音效果?