我正在尝试为我的角镖组件中的聚合物纸张列表框中的按键创建回调。回调似乎已经建立。关键是页面。如果我在焦点位于列表框之外时按下它,则没有任何反应。在列表框中,我收到错误:
Uncaught TypeError: Cannot read property 'call' of undefined
Polymer.IronA11yKeysBehavior._triggerKeyHandler @ (index):14940
Polymer.IronA11yKeysBehavior._onKeyBindingEvent @ (index):14924
我的组件中的相关代码是:
@Component(selector: 'my-artists',
templateUrl: 'artists_component.html',
//encapsulation: ViewEncapsulation.Native, // added for polymer
styleUrls: const['artist.css']
)
class ArtistsComponent implements OnInit {
PaperListbox listbox;
...
void ngOnInit() {
getArtists();
listbox = querySelector('.scroll-list');
listbox.addOwnKeyBinding('pageup', 'onPageUp');
}
...
void onPageUp(Event e) {
print('in page up');
}
html是:
<paper-listbox class="scroll-list">
<paper-item class="item-height" *ngFor="let artist of artists" [class.selected]="artist == selectedArtist" (click)="onSelect(artist)">
{{artist.first_name}} {{artist.last_name}}
</paper-item>
</paper-listbox>
index.html是:
<!DOCTYPE html>
<html>
<head>
<title>Jazz Cat</title>
<script>
window.Polymer = window.Polymer || {};
window.Polymer.dom = 'shadow';
</script>
<!-- For testing using pub serve directly use: -->
<base href="/">
<!-- For testing in WebStorm use: -->
<!-- <base href="/dart/web/"> -->
<link rel="import" href="packages/polymer/polymer.html">
<link rel="import" href="packages/polymer_elements/iron_flex_layout.html">
<link rel="import" href="packages/polymer_elements/paper_header_panel.html">
<link rel="import" href="packages/polymer_elements/paper_toolbar.html">
<link rel="import" href="packages/polymer_elements/paper_menu.html">
<link rel="import" href="packages/polymer_elements/paper_item.html">
<link rel="import" href="packages/polymer_elements/paper_menu_button.html">
<link href="master.css" rel="stylesheet" type="text/css" />
<style is="custom-style">
...
</style>
<script defer src="main.dart" type="application/dart"></script>
<script defer src="packages/browser/dart.js"></script>
</head>
<my-app>Loading...</my-app>
</html>
错误似乎很常见,因为有几个问题在stackoverflow上提到它。似乎没有人适合我的情况。我还看到了两年前的一个错误报告,我原本认为它已被修复了。 我正在使用:
polymer: ^1.0.0-rc.17
polymer_elements: ^1.0.0-rc.8
angular2: 2.0.0-beta.17
我在Dartium进行测试。这是Polymer.IronAllKeysBehavior._onKeyBindingEvent中的代码行:
this[handlerName].call(this, event);
handlerName是“onPageUp”。这是一个paper-listbox.scroll-list对象。 event是页面调试键的CustomEvent。