angular2将事件绑定到可观察对象

时间:2016-11-24 19:59:26

标签: angular angular2-observables

我尝试绑定key up事件和observable对象,每次按下textbox字段中的一个键,我想记录"你已经按下了:" +键盘中的+键字符串,没有任何错误显示但按键时也没有发生..

 /// <reference path="../../../typings/tsd.d.ts" />
import { Component } from '@angular/core';
import {Observable} from 'rxjs/Rx';
@Component({
    moduleId:module.id,
    selector: 'search-samp',
    template: '<input id="search" type="text" class="form-control" placeholder="search">'
})
export class SearchComponent {
    constructor(){
         var keyups = Observable.fromEvent($("#search"), "keyup").map(e=> {e.target.value});
         keyups.subscribe(data => { 
             debugger
             console.log("you have pressed:"+data)});
    }
 }

为什么不能正常工作?

编辑:

 var keyups = Observable.fromEvent($("#search"), "keyup").map(function(e){debugger});

无法到达地图函数内部的调试点。看起来事件从未正确绑定..但为什么?

1 个答案:

答案 0 :(得分:5)

1)你应该等到调用ngAfterViewInit(DOM中没有模板的元素)

2)您必须更改map功能的代码

.map(e => { return e.target.value; })

.map(e => e.target.value)

<强> Plunker Example