如何在 Angular 6 中导入 rxjs 计时器？答案

【问题标题】：How to import rxjs timer in angular 6?如何在 Angular 6 中导入 rxjs 计时器？
【发布时间】：2018-10-18 03:22:51
【问题描述】：

我尝试在我的 Angular 6 项目中导入 rxjs 计时器，例如

import { timer } from 'rxjs/observable/timer';

我也试过了，

Rx.Observable.timer(200, 100)

他们不工作

这是plunker上的代码

【问题讨论】：

嘿@anonymous，你的答案是正确的，但它适用于 RxJs 版本 5
嘿 md-5h0413 这个问题被问到，答案在两年前被接受，你现在正在发表评论。

标签： angular timer rxjs6

【解决方案1】：

所有可观察类 (https://github.com/ReactiveX/rxjs/tree/5.5.8/src/observable) 已从 v6 中删除，以支持执行与类方法相同操作的现有或新运算符。

import { timer } from 'rxjs';
import { timeInterval, pluck, take} from 'rxjs/operators';

var sourcef = timer(200, 100)
  .pipe(
    timeInterval(),
    pluck('interval'),
    take(3)
  )

Forked Example

另见

https://github.com/ReactiveX/rxjs/blob/master/docs_app/content/guide/v6/migration.md#observable-classes

【讨论】：

你能回答这个问题吗stackoverflow.com/questions/57756602/…

【解决方案2】：

从rxjs 6（在angular 6项目中使用），一般规则如下：

rxjs：创建方法、类型、调度程序和实用程序

import { timer, Observable, Subject, asapScheduler, pipe, of, from,
         interval, merge, fromEvent } from 'rxjs';

rxjs/operators：所有可管道操作符：

import { map, filter, scan } from 'rxjs/operators';

这里是迁移指南：https://github.com/ReactiveX/rxjs/blob/master/MIGRATION.md#observable-classes

【讨论】：

@NitinJadhav 当我升级到 angular 6 / rxjs 6+ 时，我不得不手动更新 tslint.json > import-blacklist 部分并删除“rxjs”。这样做是有意义的，因为这只适用于以前版本的 rxjs

【解决方案3】：

从 rxjs 6.2.2 开始，对于这个导入

import { timer } from 'rxjs';   // gives tslint blacklisted error

tslint 报错：

ERR: [tslint] This import is blacklisted, 
import a submodule instead (import-blacklist)

但这可以正常工作，没有任何错误

import { timer } from 'rxjs/observable/timer'; //works fine

【讨论】：

你知道为什么限制直接从rxjs导入吗？只是好奇。
@SiddhantSwami AIAIK 因为直接从 rxjs 导入会导致整个包的导入非常大。当您从 'rxjs/observable/timer' 导入时，Angular 可以摇树代码，从而减少包大小。
从 rxjs 导入是正确的前进方向。如果您从以前版本的 angular 迁移，则必须手动更新 tslint > import-blacklist 部分以删除此部分。您可以通过下载最新版本的 @angular/cli 来验证这一点，生成一个新的 Angular 应用程序并检查 import-blacklist defaults
@SiddhantSwami 这里有解释stackoverflow.com/questions/45697345/…
我必须导入 fom rxjs/internal/observable/timer (RXJS v6.1.0)

【解决方案4】：

在我的例子中，我使用 import { timer } from 'rxjs/Observable/timer';像这样。

但需要在 import { timer } from 'rxjs/observable/timer' 中使用；可观察而不是可观察。

就是这样……享受你的编码吧。

【讨论】：