Angular rxjs Observable.timer 不是带导入的函数

标签 angular typescript rxjs ngrx

在我的 Angular 应用程序中,我收到以下错误:

ERROR TypeError: rxjs_Observable__WEBPACK_IMPORTED_MODULE_4__.Observable.timer is not a function at SwitchMapSubscriber.project (hybrid.effect.ts:20) at SwitchMapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/switchMap.js.SwitchMapSubscriber._next (switchMap.js:34) at SwitchMapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next (Subscriber.js:54) at FilterSubscriber.push../node_modules/rxjs/_esm5/internal/operators/filter.js.FilterSubscriber._next (filter.js:38) at FilterSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next (Subscriber.js:54) at ScannedActionsSubject.push../node_modules/rxjs/_esm5/internal/Subject.js.Subject.next (Subject.js:47) at SafeSubscriber._next (store.js:332) at SafeSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.__tryOrUnsub (Subscriber.js:195) at SafeSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.next (Subscriber.js:133) at Subscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._next (Subscriber.js:77)

我的代码如下所示:

import { Injectable } from '@angular/core';
import { Effect, Actions } from '@ngrx/effects';
import { of } from 'rxjs/observable/of';
import { map, catchError, switchMap } from 'rxjs/operators';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/timer';

import * as hybridActions from '../actions/hybrid.action';
import { FleetStatusReportService } from '../../fleet-status-report.service';

@Injectable()
export class HybridEffects {
  constructor(
    private actions$: Actions,
    private fleetstatusreportService: FleetStatusReportService
  ) {}

  @Effect()
  loadHybrid$ = this.actions$.ofType(hybridActions.LOAD_HYBRID).pipe(
    switchMap(() => Observable.timer(0, 900000)),
    switchMap(() => {
      return this.fleetstatusreportService.getHybridPerformance().pipe(
        map(hybrid => new hybridActions.LoadHybridSuccess(hybrid)),
        catchError(error => of(new hybridActions.LoadHybridFail(error)))
      );
    })
  );
}

我一直在网上四处寻找,对我来说,最新的 Angular 版本似乎会使用

import 'rxjs/add/observable/timer';

然而,它似乎不起作用。有谁知道如何解决这个问题?

最佳答案

如果你在 RxJS 6 中使用最新的 Angular ,那么你需要这样做:

import { map, catchError, switchMap } from 'rxjs/operators';
import { Observable, of, timer } from 'rxjs';

loadHybrid$ = this.actions$.ofType(hybridActions.LOAD_HYBRID).pipe(
  switchMap(() => timer(0, 900000)),
  switchMap(() => {
    return this.fleetstatusreportService.getHybridPerformance().pipe(
      map(hybrid => new hybridActions.LoadHybridSuccess(hybrid)),
      catchError(error => of(new hybridActions.LoadHybridFail(error)))
    );
  })
);

基本上 Observable 不再有猴子补丁,现在您需要从 rxjs 导入 timer 函数并使用它。

有关此更改的更多信息,请参见此处:

https://github.com/ReactiveX/rxjs/blob/master/doc/pipeable-operators.md

关于Angular rxjs Observable.timer 不是带导入的函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52343011/

相关文章:

Angular 5 : Deploy app to IIS under nested folder

node.js - 部署 Mean-Stack 项目时出现问题。遇到 CORS 阻止每个请求的问题

javascript - 导出时输入 "only refers to a type, but is being used as a value here"

typescript - 是否有计划将 Protected 添加到 typescript

Angular 2 使用 observable 的力量缓存 http 请求

node.js - RxJS if-else 就像管道过滤

javascript - 选择选项不会在第一个值上为 'trigger'

angular - 如何以 Angular 向条件添加多个类

css - Angular 2 : How to correctly automatically import normalize. CSS

angular - 当订阅后调用 next 时,如何获取订阅中 Observable 上最后发出的值?