Polymer 1.0 - iron-list - 选择
Polymer 1.0 - iron-list - selection
在 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
When true, tapping a row will select the item, placing its data model in the set of selected items retrievable via the selection property.
Note that tapping focusable elements within the list item will not result in selection, since they are presumed to have their * own action.
好的,有人了解过 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>
在 Dart 方面:
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}');
}
}
}
换行
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
}
在 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
When true, tapping a row will select the item, placing its data model in the set of selected items retrievable via the selection property.
Note that tapping focusable elements within the list item will not result in selection, since they are presumed to have their * own action.
好的,有人了解过 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>
在 Dart 方面:
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}');
}
}
}
换行
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
}