таймер rxjs в angular7 - PullRequest
       1

таймер rxjs в angular7

0 голосов
/ 14 мая 2019

Я обновил свой проект с cli 5 до cli 7, и я только что столкнулся с некоторой проблемой

import { Component, Input, Output, OnInit, EventEmitter } from '@angular/core'
import { Observable, Subscription } from 'rxjs/Rx';

@Component({
  selector: 'countdown',
  template: '{{ countDown | async | formatTime }}'
})
export class CountdownComponent implements OnInit {
  @Input() seconds: string;
  @Output() checkTime: EventEmitter<number> = new EventEmitter();
  countDown: any;

  constructor() {}

  ngOnInit() {
    const start = parseInt(this.seconds, 10);
    this.countDown = Observable.timer(0, 1000)
                .map(i => start - i) // decrement the stream's value and return
                .takeWhile(i => i >= 0)
                .do(s => this.checkTime.emit(s)) // do a side effect without affecting value
  }
}

похоже, что rxjs сильно изменился в angular 7, и у меня возникли некоторые проблемы с преобразованием этого существующего this.countDown до новой версии.

То есть я больше не могу использовать Observable.timer?как я могу изменить это, пожалуйста?

1 Ответ

3 голосов
/ 14 мая 2019

Когда вы обновили свой угловой проект с 5 до 7, rxjs также обновился до версии 6. Вы можете использовать это вместо

import { Component, Input, Output, OnInit, EventEmitter } from '@angular/core';
import { timer, Observable } from 'rxjs';
import { map, takeWhile, tap } from 'rxjs/operators';

@Component({
  selector: 'countdown',
  template: '{{ countDown | async | formatTime }}'
})
export class CountdownComponent implements OnInit {
   @Input() seconds: string;
   @Output() checkTime: EventEmitter<number> = new EventEmitter();
  countDown: any;

  constructor() {}

  ngOnInit() {
    const start = parseInt(this.seconds, 10);
    this.countDown = timer(0, 1000).pipe(
        map(i => start - i),
        takeWhile(i => i >= 0),
        tap(s => this.checkTime.emit(s))
        );
    }
 }
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...