如何在angular2中为左右键添加事件?

时间:2017-02-13 16:29:29

标签: angular

我已经编写了如下所述的代码。截至目前,仅在鼠标单击时选择列表项。即使我在键盘上向上和向下按箭头,我也要遍历列表。如何使用angular2实现这个目的?

import { Component } from '@angular/core';

export class Hero {
name: string;
}

const HEROES: Hero[] = [
{ name: 'STWX1' },
{ name: 'STWX2' },
{ name: 'STWX3' },
{ name: 'STWX4' }
];

@Component({
selector: 'my-app',
template: `
    <div style="display: inline-block; width = 200px; ">
        <ul class="heroes">
            <li *ngFor="let hero of heroes" (click)="onSelect(hero)"
                [class.selected]="hero === selectedHero">
                 <p>{{hero.name}}</p>
            </li>
       </ul>
   </div>'

,    款式:[...] })

export class AppComponent  {
name = 'Angular1';
testRequestId = '3224';
heroes = HEROES;
selectedHero: Hero;

goToDivClick() {
    return HEROES;
}

onSelect(hero: Hero): void {
    this.selectedHero = hero;
}

}

1 个答案:

答案 0 :(得分:7)

<ComboBox ItemsSource="{Binding DataContext.PortCollection, RelativeSource={RelativeSource AncestorType={x:Type Window}}}" 
                                  DisplayMemberPath="PortName"
                                  SelectedItem="{Binding Port1}">

另见https://github.com/angular/angular/blob/630d93150a58581a0d474ebf1befb5d09b6813c5/modules/angular2/src/platform/browser/browser_adapter.dart