Polymer 1.0 - 铁列表 - 选择

Question

在 dart Polymer 1.0 中使用 iron-list。尝试通过选择列表中的项目来实现一个铁列表。这在项目是字符串时有效，但对于结构化类型则失败。

当运行下面的代码时，得到以下打印输出。

>Contains : false
>Uncaught Unhandled exception:
>NoSuchMethodError: method not found: 'shorttext'
>Receiver: Instance of 'JsObjectImpl'

A breakpoint inside (objText != null) list "objText->JavaScriptView->proto>get/set shorttext" 关闭，但提示绑定有问题。

iron-list 文档提到了一些关于对项目执行操作的内容。文档中的 JavaScript 示例有选择并使用模型。

https://elements.polymer-project.org/elements/iron-list

当为 true 时，点击一行将选择项目，将其数据模型放置在可通过 selection 属性检索的选定项目集中。

请注意，点击列表项中的可聚焦元素不会导致选择，因为它们被认为有自己的操作。

好的，有人研究过 dart-polymer 1.0 的类似部分吗？也欢迎就如何使用精选的铁名单提出建议？

HTML 端：

 <iron-list id="id_list" items="{{listitem}}" as="item" selection-enabled>
   <template>
     <paper-item on-tap="tap_event">{{item.shorttext}}</paper-item>
   </template>
 </iron-list>

飞镖方面：

class ItemText extends JsProxy {

  @reflectable
  String shorttext;
  ItemText(this.shorttext);
}

@PolymerRegister('list-demo')
class ListDemo extends PolymerElement {

  @property
  List<ItemText> listitem;

  @property
  int nrelements = 10;

  // Constructor used to create instance of MainApp.
  ListDemo.created() : super.created(){
    List<ItemText> l = [];

    for (int i = 0; i < nrelements; ++i){
      l.add(new ItemText('Name ' + i.toString()));
    }

    listitem = l;
    print('created : ${$['id_list'].selectionEnabled}');
    this.notifyPath('listitem', listitem);
  }

  @reflectable
  void tap_event(event, [_]) {

    IronList e = $['id_list'];
    Object objText = e.selectedItem;
    if (objText != null){
      print('Contains : ${listitem.contains(objText)}');
      print('The short text : ${objText.shorttext}');
    }
  }

}

Answer 1

换行

Object objText = e.selectedItem;

到

ItemText objText = convertToDart(e.selectedItem);

我猜这是一个错误。请报告https://github.com/dart-lang/polymer-dart

我建议不要使用 Polymer 元素的 .created() 构造函数。请改用attached() 或ready()。

考虑将selectedItem 绑定到一个属性，并在selectedItem 值更改时运行您的代码，而不是on-tap 事件。

`<iron-list ... selected-item="{{selectedItem}}">`

@Property(observer: 'selectedItemChanged') ItemText selectedItem;

@reflectable
void selectedItemChanged(newValue, oldValue) {
  // your code here
}

或

@property ItemText selectedItem;

@Observe('selectedItem')
void selectedItemChanged(ItemText newValue) {
  // your code here
}