TSLint令人讨厌的消息

Question

在我的角度组件上，我正在使用RxJs中的两种方法debounceTime debounceTime()和distinctUntilChanged()

import { Component, OnInit } from '@angular/core';
import { FormControl } from '@angular/forms';

import 'rxjs/add/operator/debounceTime';
import 'rxjs/add/operator/distinctUntilChanged';

@Component({
  selector: 'app-form4th',
  templateUrl: './form4th.component.html',
})
export class Form4thComponent implements OnInit {
  searchField: FormControl;
  searches: string[] = [];

  constructor() { }

  ngOnInit() {
    this.searchField = new FormControl();
    this.searchField
        .valueChanges
        .debounceTime(400)
        .distinctUntilChanged()
        .subscribe(term => {
          this.searches.push(term);
        });
  }
}

应用程序运行正常 ，在进行（build）即ng serve时没有错误，甚至没有警告消息 ，并且在浏览器上运行该应用程序按预期工作，并且在浏览器控制台上也没有错误消息或警告。

但是 ，我在vscode上有一条奇怪的TSLint消息，说：

[ts] Property 'debounceTime' does not exist on type 'Observable<any>'.

这有点烦人，因为我有点担心某些东西在我不了解的情况下无法正常工作。

我在这里想念什么？ 谢谢。

Answer 1

如某些注释中所述，这不是TSLINT错误，而是Typescript错误。

在这里，要做的是在修补Observable的原型： import 'rxjs/add/operator/debounceTime'; import 'rxjs/add/operator/distinctUntilChanged'; import 'rxjs/add/operator/debounceTime'; import 'rxjs/add/operator/distinctUntilChanged';

而不是这样做，您可能只想利用自rxjs v5.5以来的新功能，称为lettable lettable operators 。 它允许您使用一个新的.pipe运算符，该运算符将函数作为参数（rxjs运算符或您自己的）。

因此，请尝试以下代码，而不是您的代码：

import { Component, OnInit } from '@angular/core';
import { FormControl } from '@angular/forms';

// notice this import will not patch `Observable` prototype
import { debounceTime, distinctUntilChanged } from 'rxjs/operators';

@Component({
  selector: 'app-form4th',
  templateUrl: './form4th.component.html',
})
export class Form4thComponent implements OnInit {
  searchField: FormControl;
  searches: string[] = [];

  constructor() { }

  ngOnInit() {
    this.searchField = new FormControl();

    this.searchField
      .valueChanges
      .pipe(
        debounceTime(400),
        distinctUntilChanged()
      )
      .subscribe(term => {
        this.searches.push(term);
      });
  }
}

通过不修补Observable的原型，它可以帮助捆绑程序进行树状摇动（如果可用），但是我敢肯定Typescript进行必要的检查会更加容易，因为必须将功能导入同一文件中。 （也就是说，一段时间以来，我一直在使用旧的时尚方法，而VSC仍在按预期方式工作）。