Scheduler.async的RxJS依赖问题

cod*_*der 6 rxjs typescript rxjs5 angular

我在Angular2组件类的构造函数中有以下代码:

var observable = Observable.create(function (observer) {
      observer.next(1);
      observer.next(2);
      observer.next(3);
      observer.complete();
    }).observeOn(Scheduler.async);
Run Code Online (Sandbox Code Playgroud)

我导入包括以下内容:

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/observeOn';
import { Scheduler } from 'rxjs/Scheduler';
import 'rxjs/scheduler/async';
Run Code Online (Sandbox Code Playgroud)

我也尝试了以下导入,而不是上面的上一次导入:

import { async } from 'rxjs/scheduler/async';
Run Code Online (Sandbox Code Playgroud)

使用Angulat CLI构建项目时出现以下错误消息:

Property 'async' does not exist on type 'typeof Scheduler'
Run Code Online (Sandbox Code Playgroud)

我错过了什么?

Tie*_*han 7

是的,这是正确的,因为:

import { Scheduler } from 'rxjs/Scheduler';
Run Code Online (Sandbox Code Playgroud)

这意味着,您导入了这个类:https://github.com/ReactiveX/rxjs/blob/5.4.0/src/Scheduler.ts#L8-L63

import { async } from 'rxjs/scheduler/async';
Run Code Online (Sandbox Code Playgroud)

https://github.com/ReactiveX/rxjs/blob/5.4.0/src/scheduler/async.ts#L47

所以你可以看到,Scheduler没有async属性,我想你想Rx.Scheduler.async 在这里转换这个东西源代码,你可以尝试这个解决方案:

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/observeOn';

import { async } from 'rxjs/scheduler/async';

var observable = Observable.create(function (observer) {
      observer.next(1);
      observer.next(2);
      observer.next(3);
      observer.complete();
    }).observeOn(async);
Run Code Online (Sandbox Code Playgroud)


mar*_*tin 6

我认为这应该得到更深入的解释.

如果你只写:

import { Scheduler } from 'rxjs/Scheduler';
Run Code Online (Sandbox Code Playgroud)

你只导入了Scheduler你可能永远不想自己使用的类.导入它仅用于正确的类型检查是有用的,所以你可以有例如:

import { Scheduler } from 'rxjs/Scheduler';

class MyClass {
    sched: Scheduler;
}
Run Code Online (Sandbox Code Playgroud)

但只导入async您正在导入已经存在的AsyncScheduler类实例.这是一个单例模式,因为通常不需要有多个AsyncScheduler实例.

import { async } from 'rxjs/scheduler/async';
Run Code Online (Sandbox Code Playgroud)

现在您可以查看此特定调度程序的当前时间:

async.now();
Run Code Online (Sandbox Code Playgroud)

其实从进口rxjs/scheduler/async是一样的使用Scheduler,从刚刚导入rxjs这实际上是Rx.ts:

import { Scheduler } from 'rxjs';

...

Scheduler.async.now();
Run Code Online (Sandbox Code Playgroud)

您可以看到已经准备了更多不同的调度程序:https://github.com/ReactiveX/rxjs/blob/master/src/Rx.ts#L193-L198

这里令人困惑的是使用asyncfrom 'rxjs/scheduler/async'Scheduler.asyncfrom 有什么区别'rxjs'.asyncRx.ts刚刚导入相同的'rxjs/scheduler/async',但因为你要导入rxjs你还包括中定义的所有的依赖Rx.ts.这意味着您要导入所有运算符,这些运算符是您可能不需要的大量文件.

这就是为什么最好只导入它'rxjs/scheduler/async'而不是导入它'rxjs':

import { async } from 'rxjs/scheduler/async'
Run Code Online (Sandbox Code Playgroud)


zer*_*298 5

我知道这是为标记的,,但是如果您到达这里并且对为什么其他答案不适合您感到困惑,我认为调度程序的位置在 v6 中再次移动。我有一个 webpack 开发环境,我必须将调度程序从裸rxjs模块中移除。如果检查导入的模块,您可以看到所有调度程序:

import * as rxjs from "rxjs";
console.log(Object.keys(rxjs).filter(k => k.includes("Scheduler")));
Run Code Online (Sandbox Code Playgroud)

将打印:

"asapScheduler"
"asyncScheduler"
"queueScheduler"
"animationFrameScheduler"
"VirtualTimeScheduler"
"Scheduler"
Run Code Online (Sandbox Code Playgroud)

因此,如果你想要async调度程序,你可以这样做:

import {asyncScheduler} from "rxjs";
Run Code Online (Sandbox Code Playgroud)