rxjs

问题 I want to write a unit test for a photo-upload-mehtod. But I get the Failed: this.task.snapshotChanges(...).pipe is not a function TypeError: this.task.snapshotChanges(...).pipe is not a function Error. For the sake of simplicity of this question, I put the code all in one method: Component public startUpload(event: FileList) { const file: File = event.item(0); const pathRef = `users/${this.uid}`; this.task = this.service.uploadPhoto(pathRef, file); this.fileRef = this.service

问题 DRY (Don't Repeat Yourself) Suppose I have this code used a lot in my app: observable$.pipe( tap(value => console.log(value)), map(value => value * 5), ... more repeated stuff ) Suppose that the value 5 is different in some parts of the code but everything else is identical. Can I somehow functionalise / do something to this to make it reusable to avoid copy paste issues? Could I do something like this? observable$.pipe( getReusedOperators(7), // this would pipe to all above operators using 7

问题 DRY (Don't Repeat Yourself) Suppose I have this code used a lot in my app: observable$.pipe( tap(value => console.log(value)), map(value => value * 5), ... more repeated stuff ) Suppose that the value 5 is different in some parts of the code but everything else is identical. Can I somehow functionalise / do something to this to make it reusable to avoid copy paste issues? Could I do something like this? observable$.pipe( getReusedOperators(7), // this would pipe to all above operators using 7

问题 In my template I have a field and two buttons: <div class="btn-plus" (click)="add(1)"> - </div> <div class="txt"> {{ myValue }} </div> <div class="btn-minus" (click)="add(-1)"> + </div> In my component .ts file I have: add(num) { this.myValue +=num; this.update(); // async function which will send PUT request } The this.update() function puts myValue in the proper field in a big JSON object and sends it to a server. Problem : When a user clicks 10x in a short period of time on button plus

问题 Suppose I have two observables. Every time the first one emits, I want to wait 2 seconds to see whether during that period the other observable emits something. If yes, do not emit anything. If no, emit. Example: const start$ = this.events.pipe( delay(1000), takeUntil(theSecondObservable) // WHAT SHOULD BE HERE? ).subscribe((value) => { console.log(value); }); 回答1: This solution does not complete when the end$ observable emits and uses RxJS 6 syntax. const start$ = this.router.events.pipe(map

问题 Suppose I have two observables. Every time the first one emits, I want to wait 2 seconds to see whether during that period the other observable emits something. If yes, do not emit anything. If no, emit. Example: const start$ = this.events.pipe( delay(1000), takeUntil(theSecondObservable) // WHAT SHOULD BE HERE? ).subscribe((value) => { console.log(value); }); 回答1: This solution does not complete when the end$ observable emits and uses RxJS 6 syntax. const start$ = this.router.events.pipe(map

问题 I am currently triing to create a small project to demo Reactive Programming with RxJS. The goal is to show my colleagues that this thing is out there, and it is worth looking into. I'm not experienced with the framework, so that makes things complicated. I am triing to expand another demo of mine to utilize RxJS. It is not a very complicated demo, basically I can add any number of small forms, wich result in a number calculated by a small formula, and there is a button, wich sums up the

问题 This question already has an answer here : Template binding with function return Observable and async pipe (1 answer) Closed 13 days ago . Note I have created a simplified version of this question at Template binding with function return Observable and async pipe Template: <div *ngIf="entity?.ext.insuredDetails.insuredType$() | async as insuredType"> {{insuredType}} </div> insuredType$ definition: @NeedsElement(sp(115621),ap(116215)) insuredType$(): Observable<string> { return empty(); }

问题 I have an intercept that listens requests/responses. I have tried to run spinner only if requests comes more then 1 seconds: @Injectable() export class LoadingInterceptor implements HttpInterceptor { private requests: HttpRequest<any>[] = []; constructor(private spinnerService: SpinnerService) {} intercept( req: HttpRequest<any>, next: HttpHandler ): Observable<HttpEvent<any>> { this.requests.push(req); this.spinnerService.isLoading.next(true); return new Observable((observer) => { next

问题 I have an intercept that listens requests/responses. I have tried to run spinner only if requests comes more then 1 seconds: @Injectable() export class LoadingInterceptor implements HttpInterceptor { private requests: HttpRequest<any>[] = []; constructor(private spinnerService: SpinnerService) {} intercept( req: HttpRequest<any>, next: HttpHandler ): Observable<HttpEvent<any>> { this.requests.push(req); this.spinnerService.isLoading.next(true); return new Observable((observer) => { next