我在angularjs2中引入Rx.Observable
import { Observable } from 'rxjs/Observable'
使用
Observable.fromEvent(dom,type)
控制台报错:
ERROR TypeError: Observable_1.Observable.fromEvent is not a function
求正确姿势。
补充源码
import { Component } from "@angular/core"import { Observable } from 'rxjs/Observable'import 'rxjs/add/observable/fromEvent'@Component({ selector:"custom", template:`<div> <input (input)="onInput($event)" /> <button (click)="onAdd()">add</button> <ul *ngFor="let item of list"> <li>{{item}} <button (click)="onDelete(item)">delete</button></li> </ul> </div>`})export class Custom { inputValue = ""; list = ["123"]; numberic(event:any):void{ var value = event.target.value; function toNumber(string){ if( isNaN(string.slice(0,-1)) ){ //包含非数字及小数点的字符,直接切掉 if(/[^\d|\.]/gi.test(string)){ return string.replace(/[^\d\.]/gi,"") } //第一位为小数点,直接切掉 if(string.indexOf(".") === 0){ return string.slice(1) } //包含两个小数点,切掉最后一个小数点 let lastDotIndex = string.lastIndexOf("."); let strings = string.split(""); strings.splice(lastDotIndex,1); return strings.join("") }else{ return string.slice(0,-1) } }; event.target.value = (isNaN(value) ? toNumber(value) : value); this.inputValue = event.target.value; } onInput($event:any):void{ // this.numberic($event); var dom = $event.target; console.log("dom",dom,Observable); var type = $event.type; Observable.fromEvent(dom,type) .do((event)=>{ this.numberic(event) }) .map((event)=>event.target.value) .subscribe((value){ console.log("value",value); }) } onAdd():void{ let hasItemInList = this.list.some((value,index){ return value == this.inputValue; }); if(!hasItemInList){ console.log("onAdd"); this.list.push(this.inputValue); }else{ console.log("已存在相同值,勿须重新添加"); } } onDelete(item):void{ console.log("onDelete") this.list = this.list.filter((value,index)=>{ return item !== value; }); }}
解决方案
你需要引入fromEvent
import { Observable } from 'rxjs/Observable'
import 'rxjs/add/observable/fromEvent'
...
或者
import { Observable } from 'rxjs'
一个是分开引入一个是全部引入