【问题标题】:Angular rxjs Observable.timer is not a function with importAngular rxjs Observable.timer 不是具有导入功能的函数
【发布时间】:2019-02-19 22:02:44
【问题描述】:

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

错误类型错误: rxjs_Observable__WEBPACK_IMPORTED_MODULE_4__.Observable.timer 不是 功能 在 SwitchMapSubscriber.project (hybrid.effect.ts:20) 在 SwitchMapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/switchMap.js.SwitchMapSubscriber._next (switchMap.js:34) 在 SwitchMapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next (订阅者.js:54) 在 FilterSubscriber.push../node_modules/rxjs/_esm5/internal/operators/filter.js.FilterSubscriber._next (filter.js:38) 在 FilterSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next (订阅者.js:54) 在 ScannedActionsSubject.push../node_modules/rxjs/_esm5/internal/Subject.js.Subject.next (主题.js:47) 在 SafeSubscriber._next (store.js:332) 在 SafeSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.__tryOrUnsub (Subscriber.js:195) 在 SafeSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.next (订阅者.js:133) 在 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?
  • 我正在使用 rxjs 6!
  • 下面的答案应该会有所帮助

标签: angular typescript rxjs ngrx


【解决方案1】:

如果你在 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

【讨论】:

  • 感谢您的回复!我让它工作。然而,当我写 import { Observable, of, timer } from 'rxjs'; ,当我将鼠标悬停在计时器上时,它给了我以下消息:“'timer' 已声明,但它的值从未被读取。”,以及我的代码中的一个错误(因为它没有捡起我假设)。如果我添加了 import 'rxjs/add/observable/timer';它解决了这个问题。你知道为什么会这样吗?
  • 听起来只是对您的 IDE 的错误猜测。如果您没有收到任何编译错误,那么您的代码是有效的。从 v6 开始,直接从 rxjs 导入应该是首选方式。
猜你喜欢
  • 2023-03-26
  • 2018-09-17
  • 2017-04-08
  • 1970-01-01
  • 2017-04-06
  • 1970-01-01
  • 1970-01-01
  • 2019-12-04
  • 1970-01-01
相关资源
最近更新 更多