Nativescript将LIstPicker与JS对象一起使用

gui*_*ebl 3 javascript nativescript angular2-nativescript

我正在尝试将ListPicker与对象数组一起使用,并且使用所有元素显示[object Object]的标签来呈现列表。

我想指定哪个属性用作列表选择器的“标签”。

不幸的是,Nativescript ListPicker仅接受一个字符串数组,并且我不能使用我的Object数组,因为标签将调用toString()

我发现了基于以下的替代解决方案:https : //github.com/NativeScript/NativeScript/issues/1677

购买我的应用程序时使用的是page-router-outlet,并且不使用元素,因此我无法使用上述建议的方法。在这种情况下,有没有可能将ListPicker与对象数组一起使用,或者有任何不依赖Page元素加载事件的解决方法?

Chr*_*odz 5

您根本不必使用任何加载的事件。只需覆盖该toString方法并将项目传递给 ListPicker:

  public countries: any[] = [
    {
      value: 0,
      name: 'Sweden',
      toString: () => {
        return 'Sweden';
      }
    },
    {
      value: 1,
      name: 'Denmark',
      toString: () => {
        return 'Denmark';
      }
    },
    {
      value: 2,
      name: 'Norway',
      toString: () => {
        return 'Norway';
      }
    },
    {
      value: 3,
      name: 'Finland',
      toString: () => {
        return 'Finland';
      }
    },
    {
      value: 4,
      name: 'Iceland',
      toString: () => {
        return 'Iceland';
      }
    },
  ];
Run Code Online (Sandbox Code Playgroud)

将它们传递给选择器:

<ListPicker [items]="countries"></ListPicker>
Run Code Online (Sandbox Code Playgroud)


Dar*_*ron 5

有一个未记录的拉取请求,使绑定对象变得更加容易:https : //github.com/NativeScript/NativeScript/pull/6033

ListView组件添加新属性(textField并且 valueField-应该与JSON对象数组一起使用):

textField -告诉listview应该使用哪个属性来显示每个项目。

valueField -告诉listview应该使用哪个属性来更新selectedValue。

selectedValue-是将包含的属性selectedValue(如果valueField已指定),则它将包含该属性的值,否则将包含整个选定项

示例(角度):

<ListPicker [items]="printers" textField="name" valueField="id"></ListPicker>
Run Code Online (Sandbox Code Playgroud)

在班上:

const printers = [{name: "Printer 1", id: 1}, {name: "Printer 2", id: 2}];
Run Code Online (Sandbox Code Playgroud)