angular2 Observable 属性“debouceTime"在类型“Observable<any>"上不存在 [英] angular2 Observable Property &#39;debouceTime&#39; does not exist on type &#39;Observable&lt;any&gt;&#39;

问题描述

我使用 "angular2 webpack" 和 "angular2/form,Observable" ，但遇到错误，需要帮助..

有一个自定义表单验证器 --

import {Observable} from 'rxjs/Rx';从@angular/forms"导入 {REACTIVE_FORM_DIRECTIVES,FormControl, FormGroup, Validators}；emailShouldBeUnique(control:FormControl) {返回新的 Observable((obs:any)=>{control.valueChanges.debouceTime(400).distinctUntilChanged().flatMap(term=>return !this.userQuery.emailExist(term)).订阅(资源=> {if (!res) {obs.next(null)}else {obs.next({'emailExist': true});};})});}

我可以找到文件 "/projection_direction/node_modules/rxjs/operator/debounceTime.js"

为什么会出现这样的错误--

<块引用>

'Observable' 类型不存在属性 'debouceTime'.

解决方案

确保你已经在 main.ts (应用程序启动的地方)

import "rxjs/add/operator/map";导入rxjs/add/operator/debounceTime"；...

或一次性

import "rxjs/Rx";

扩展

有一个工作示例

//我们的根应用组件从@angular/core"导入 {Component, EventEmitter, ChangeDetectorRef}从rxjs/Rx"导入{Observable}；@成分({选择器:'我的应用'，提供者:[]，模板:`<div><h2>你好{{name}}</h2><div>去抖动消息:{{message}}</div>

`，指令:[]})出口类应用{受保护的消息:字符串；受保护的发射器 = 新的 EventEmitter();公共观察:可观察的<字符串>；构造函数(){this.name = 'Angular2(发布候选！)'this.obs = this.emitter.map(x => x).去抖动时间(1200);this.obs.subscribe(msg => this.message = msg);}ngOnInit(){this.emitter.emit("去抖动后你好");}}

这在 main.ts 中有效:

//主入口点从@angular/platform-b​​rowser-dynamic"导入 {bootstrap}；从'./app'导入{App}；导入rxjs/Rx"；引导程序(应用程序，[]).catch(err => console.error(err));

在此处

检查

I use "angular2 webpack" and "angular2/form,Observable" , but met an error ,need help ..

There is a custom form validator --

import {Observable} from 'rxjs/Rx';
import {REACTIVE_FORM_DIRECTIVES,FormControl, FormGroup, Validators} from '@angular/forms';

emailShouldBeUnique(control:FormControl) {
    return new Observable((obs:any)=> {
      control.valueChanges
        .debouceTime(400)
        .distinctUntilChanged()
        .flatMap(term=>return !this.userQuery.emailExist(term))
        .subscribe(res=> {
            if (!res) {obs.next(null)}
            else {obs.next({'emailExist': true}); }; }
        )});}

I could find the file "/projection_direction/node_modules/rxjs/operator/debounceTime.js"

why is there such the error--

Property 'debouceTime' does not exist on type 'Observable'.

解决方案

Be sure you've initiated that in main.ts (where the app is bootstraped)

import "rxjs/add/operator/map";
import "rxjs/add/operator/debounceTime";
...

or all at once

import "rxjs/Rx";

EXTEND

there is a working example

//our root app component
import {Component, EventEmitter, ChangeDetectorRef} from '@angular/core'
import {Observable} from  "rxjs/Rx";
@Component({
  selector: 'my-app',
  providers: [],
  template: `
    <div>
      <h2>Hello {{name}}</h2>

        <div>debounced message: {{message}}</div>
    </div>
  `, 
  directives: []
})
export class App {

  protected message: string;
  protected emitter = new EventEmitter<string>();
  public obs: Observable<string>;

  constructor() {
    this.name = 'Angular2 (Release Candidate!)'

    this.obs = this.emitter
      .map(x => x)
      .debounceTime(1200)
      ;

    this.obs.subscribe(msg => this.message = msg);
  }

  ngOnInit(){
    this.emitter.emit("hello after debounce");
  }
}

and that is working when in main.ts we have:

//main entry point
import {bootstrap} from '@angular/platform-browser-dynamic';
import {App} from './app';

import "rxjs/Rx"; 

bootstrap(App, [])
  .catch(err => console.error(err));

Check it here

这篇关于angular2 Observable 属性“debouceTime"在类型“Observable<any>"上不存在的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！