Last Update: Mar, 2022. RxJS v7: combineLatestWith From reactiveX documentation: Whenever any input Observable emits a value, it computes a formula using the latest values from all the inputs, then emits the output of that formula. // Observables to combine const name$ = this._personService.getName(id); const document$ = this._documentService.getDocument(); name$.pipe( combineLatestWith($document) ) .subscribe(([name, document]) => { … Read more
Here’s an example // in the service getVehicles(){ return Observable.interval(2200).map(i=> [{name: ‘car 1’},{name: ‘car 2’}]) } // in the controller vehicles: Observable<Array<any>> ngOnInit() { this.vehicles = this._vehicleService.getVehicles(); } // in template <div *ngFor=”let vehicle of vehicles | async”> {{vehicle.name}} </div>
Not only does forkJoin require all input observables to be completed, but it also returns an observable that produces a single value that is an array of the last values produced by the input observables. In other words, it waits until the last input observable completes, and then produces a single value and completes. In … Read more
A couple ways I can think of import {take, publish} from ‘rxjs/operators’ import {concat} from ‘rxjs’ //Method one var one = someObservable.pipe(take(1)); var two = someOtherObservable.pipe(take(1)); concat(one, two).subscribe(function() {/*do something */}); //Method two, if they need to be separate for some reason var one = someObservable.pipe(take(1)); var two = someOtherObservable.pipe(take(1), publish()); two.subscribe(function(){/*do something */}); one.subscribe(function(){/*do … Read more
Just throw the error inside the map() operator. All callbacks in RxJS are wrapped with try-catch blocks so it’ll be caught and then sent as an error notification. This means you don’t return anything and just throw the error: map(res => { if (res.bearerToken) { return this.saveJwt(res.bearerToken); } else { throw new Error(‘Valid token not … Read more
When to use Subject.prototype.asObservable() The purpose of this is to prevent leaking the “observer side” of the Subject out of an API. Basically to prevent a leaky abstraction when you don’t want people to be able to “next” into the resulting observable. Example (NOTE: This really isn’t how you should make a data source like … Read more
1) What is a “callback hell” for someone who does not know javascript and node.js ? This other question has some examples of Javascript callback hell: How to avoid long nesting of asynchronous functions in Node.js The problem in Javascript is that the only way to “freeze” a computation and have the “rest of it” … Read more
OnDestroy lifecycle hook is available in providers. According to the docs: Lifecycle hook that is called when a directive, pipe or service is destroyed. Here’s an example: @Injectable() class Service implements OnDestroy { ngOnDestroy() { console.log(‘Service destroy’) } } @Component({ selector: ‘foo’, template: `foo`, providers: [Service] }) export class Foo implements OnDestroy { constructor(service: Service) … Read more
In short, they are very different libraries for very different purposes, but yes there are some vague similarities. Redux is a tool for managing state throughout the application. It is usually used as an architecture for UIs. Think of it as an alternative to (half of) Angular. RxJS is a reactive programming library. It is … Read more
EDIT: updated code in order to reflect changes made to the way pipes work in more recent versions of RXJS. All operators (take in my example) are now wrapped into the pipe() operator. I realize that this Question was quite a while ago and you surely have a proper solution by now, but for anyone … Read more