Nativescript 将 LIstPicker 与 JS 对象一起使用

Question

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

我想指定将哪个属性用作列表选择器的 "label"。

不幸的是，Nativescript ListPicker 只接受字符串数组，我不能使用我的对象数组，因为标签会调用 toString()

我找到了一个替代解决方案，基于：https://github.com/NativeScript/NativeScript/issues/1677

buy 我的应用程序使用 page-router-outlet 而没有使用 element 所以我无法使用上面提出的方法。鉴于这种情况，是否有任何可能的方法将 ListPicker 与对象数组一起使用或任何不依赖于页面元素加载事件的解决方法？

Answer 1

您根本不必使用任何已加载的事件。只需重写 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';
      }
    },
  ];

将 em 传递给选择器：

<ListPicker [items]="countries"></ListPicker>

Answer 2

有一个未记录的拉取请求可以更轻松地绑定到对象： https://github.com/NativeScript/NativeScript/pull/6033

Adds new properties to the ListView component (textField and valueField - should be used with arrays of JSON objects):

textField - tells the listview which property should be used to display each item.

valueField - tells the listview, which property should be used to update the selectedValue.

selectedValue - is the property that will contain the selectedValue, if valueField is specified, then it will contain the value from that property, otherwise it will contain the whole selected item

示例 (Angular):

<ListPicker [items]="printers" textField="name" valueField="id"></ListPicker>

在class中：

const printers = [{name: "Printer 1", id: 1}, {name: "Printer 2", id: 2}];

Nativescript 将 LIstPicker 与 JS 对象一起使用

Nativescript Use LIstPicker with JS object

javascript

nativescript

angular2-nativescript