[英]rxjs timer in angular7
I've upgraded my project from cli 5 to cli 7 and I just encountered some issue 我已将项目从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
}
}
seems like rxjs has changed a lot in angular 7 and I am having some problem converting this existing this.countDown
to the newer version. 似乎rxjs在angular 7中发生了很大变化,将这个现有的this.countDown
转换为较新的版本时遇到了一些问题。
So I am not able to use Observable.timer
anymore? 因此,我不能再使用Observable.timer
了? how can I change this please? 我该如何更改?
When you upgraded your angular project from 5 to 7, rxjs is also upgraded to version 6. You can use this instead 将angular项目从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))
);
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.