Nativescript Listpicker索引更改不起作用

Question

我在Nativescript中創建了一個ListPicker，我通過ts文件中的obs數組填充了這個ListPicker。

Lickpicker displaying the obs array

我設置的selectedIndex和被越來越拿起罰款。但是，當我試圖改變選擇說從一個增加到兩個，它不是拿起變化。它甚至沒有調用財產變更事件。 我的XML如下。

<StackLayout row="0"> 
    <StackLayout orientation="horizontal" style="vertical-align: center; margin: 5" row="0" cssClass="filterrow"> 
     <Button text="{{ $actAs + ' &#xf078;'}}" cssClass="filterbtn" tap="toggleActAsFilter"/> 
    </StackLayout> 

    <StackLayout cssClass="_card" style="vertical-align: center;" verticalAlignment="top" visibility="{{ showActAsFilter ? 'visible' : 'collapsed' }}"> 
     <ListPicker id="_listPicker" cssClass="filterlist" style="vertical-align: center;" items="{{ _actAsFilter }}" selectedIndex="selectedIndex" propertyChangeEvent="listIndexChanged"/> 
    </StackLayout> 

    <Label text="Selected Index:" row="1" col="0" fontSize="18" verticalAlignment="bottom"/> 
    <TextField text="{{ selectedIndex }}" row="1" col="1" /> 
</StackLayout> 

我的PropertyChangeEvent

public listIndexChanged = (args:EventData) => { 
    let page = <View>args.object; 
    console.log("list Index changed"); 
    let listP = page.getViewById("_listPicker"); 
} 

這是捕捉ListPicker方式的改變？

Answer 1

在您的情況下，您可以使用Observable propertyChange事件來處理選定項目的索引。您可以查看下面附加的示例代碼。

主page.xml

<Page xmlns="http://schemas.nativescript.org/tns.xsd" navigatingTo="navigatingTo"> 
    <StackLayout> 
    <ListPicker items="{{ items }}" selectedIndex="{{lpSelectedIndex}}"></ListPicker> 
    </StackLayout> 
</Page> 

主page.ts

import { EventData } from "data/observable"; 
import { Page } from "ui/page"; 
import {ObservableArray} from "data/observable-array"; 
import {Observable, PropertyChangeData} from "data/observable"; 

// Event handler for Page "navigatingTo" event attached in main-page.xml 
export function navigatingTo(args: EventData) { 
    // Get the event sender 
    var page = <Page>args.object; 
    var observable:Observable= new Observable(); 
    var obsarray = new ObservableArray(); 
    obsarray.push("Item1"); 
    obsarray.push("Item2"); 
    obsarray.push("Item3"); 
    observable.set("lpSelectedIndex", 0); 
    observable.set("items", obsarray); 

    observable.addEventListener(Observable.propertyChangeEvent, function (pcd: PropertyChangeData) { 
     console.log(pcd.eventName.toString() + " " + pcd.propertyName.toString() + " " + pcd.value.toString()); 
    }); 

    page.bindingContext = observable; 
}