ListView中的Observable错误地绑定了元素

时间:2015-08-08 20:07:15

标签: javascript android nativescript

在我的NativeScript App中有一个ListView。我想绑定一个Observable对象数组来单独修改每个项目。但是,NativeScript似乎为每个ListView项绑定了相同的单个项(绑定数组的最后一项)

这是我的布局:

<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能够显示&#34;项目1和#34;和&#34;项目2&#34;,但它显示&#34;项目2&#34;,&#34;项目2&#34;。您可以在此屏幕截图中看到问题:

Screenshot of the problem

目前的目标是Android。

2 个答案:

答案 0 :(得分:2)

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

答案 1 :(得分:1)

请尝试以下代码:

var items = new observableArray.ObservableArray([]);
var pageData = new observableModule.Observable();
var page;

exports.onPageLoaded = function(args) {
    page = args.object;
    items.push({name:"Item 1"});
    items.push({name:"Item 2"});
    pageData.set("items",items);
    page.bindingContext = pageData;
};

据我所知,observableArray是可观察的扩展类,因此在创建可观察数组时不需要创建新的可观察对象。