CSC360: button and Keyboard input in angular2 [5/7] Previous pageContentsNext page

Here is a starter component with a button and keyboard input:

01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
import {Component} from 'angular2/core';

@Component({
  host: { '(window:keypress)': 'keyHandler($event)' },
  selector: 'my-app',
  template: `
      <h2>{{title}} : {{x}}</h2>
      <button (click)="f()">press me</button>
      
    `,
})
export class AppComponent {
  title = "hello";
  x = 41;
  f() { this.x = this.x + 1; return this.x; }
  keyHandler(event) {
    switch (event.keyCode) {
      case 43:
        this.x = 4000;
        break;
      default:
        this.x = event.keyCode;
        break;
    }
    console.log(event, event.keyCode, event.keyIdentifier);
  }
}

(source for keyboard input)

Previous pageContentsNext page