Angular 2 用户输入 - $event 对象

angularJS 2 可以绑定到所有类型的事件

下面的代码绑定到一个输入框的 keyup 事件，并且把用户输入的东西回显到屏幕上

app/app.component.ts

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

@Component({
  selector: 'my-app',
  template: `
    <input (keyup)="onKey($event)">
    <p>{{values}}</p>
  `
})
export class AppComponent{
  values = '';

  /*
  // 非强类型
  onKey(event:any) {
    this.values += event.target.value + ' | ';
  }
  */
  // 强类型
  onKey(event: KeyboardEvent) {
    this.values += (<htmlInputElement>event.target).value + ' | ';
  }
}

上面的代码监听了一个事件并捕获用户输入，Angular 把事件对象存入 $event 变量中

组件的 onKey() 方法是用来从事件对象中提取出用户输入的，再将输入的值累加到 values 的属性

链接: https://fly63.com/course/15_841