绑定上下文不起作用Nativescript

时间:2016-07-19 20:30:43

标签: nativescript

控制台没有错误,我尝试过很多东西,但无法理解代码的实际问题。任何人都可以帮助我...以及模拟器片段和代码:

home.ts:

enter code here
import {EventData,Observable} from "data/observable";
import {Page} from "ui/page";
var page : Page;
var tempSessions = [
{
    id:"0",
title:"session 0"
},{
    id:"1",
    title:"session 1"
},{
    id:"2",
    title:"session 2"
}];
export function pageLoaded(args:EventData) {
  page = <Page>args.object;
  page.bindingContext = new Observable({
  sessions:tempSessions
  });
}

home.xml:

<Page xmlns="http://schemas.nativescript.org/tns.xsd" load="pageLoaded">
      <GridLayout rows="auto,*">
        <!--row 0-->
        <StackLayout></StackLayout>
        <!--row 1-->
        <GridLayout rows="auto,*" row="1">
          <ListView items="{{ sessions }}">
            <ListView.itemTemplate>
              <Label text="item"/>
            </ListView.itemTemplate>
          </ListView>
        </GridLayout>
      </GridLayout>
    </Page>

emulator

1 个答案:

答案 0 :(得分:1)

我在您的代码中发现了几个问题。第一个是页面事件被称为loaded而不是load。第二个是你可以使用ObservableArray Module,这会在你推送数组中的新项目时自动更新ListView。您可以查看NativeScript Getting Started Guide 主page.xml

<Page xmlns="http://schemas.nativescript.org/tns.xsd" loaded="pageLoaded">
  <GridLayout rows="auto,*">
    <!--row 0-->
    <StackLayout row="0">
      <Label text="sample text" textWrap="true" />
    </StackLayout>
    <!--row 1-->
    <GridLayout rows="*" row="1">
      <ListView row="0" items="{{ sessions }}">
        <ListView.itemTemplate>
          <StackLayout>
              <Label text="{{title}}"/>
          </StackLayout>
        </ListView.itemTemplate>
      </ListView>
    </GridLayout>
  </GridLayout>
</Page>

主page.ts

import {EventData,Observable} from "data/observable";
import {ObservableArray} from "data/observable-array";
import {Page} from "ui/page";
var page : Page;
var tempSessions = new ObservableArray();

export function pageLoaded(args:EventData) {
    tempSessions.push({
    id:"0",
title:"session 0"
});
tempSessions.push({
    id:"1",
    title:"session 1"
});
tempSessions.push({
    id:"2",
    title:"session 2"
});
  page = <Page>args.object;
  page.bindingContext = new Observable({
  sessions:tempSessions
  });
}