Enter Your Email Address to Watch This Lesson

Your link to unlock this lesson will be sent to this email address.

Unlock this lesson and all 985 of the free egghead.io lessons, plus get RxJS content delivered directly to your inbox!



Existing egghead members will not see this. Sign in.

Customizing effects from the main function

2:05 RxJS lesson by

How can we show one string on the DOM, and a completely different string on Console log? This lesson shows how we can make our main function return multiple Observables, each one targeted at a different type of effect.

Get the Code Now
click to level up

egghead.io comment guidelines

Avatar
egghead.io

How can we show one string on the DOM, and a completely different string on Console log? This lesson shows how we can make our main function return multiple Observables, each one targeted at a different type of effect.

We now have an app with two types of effects, the console log and the DOM effect. Both of these display the same string, actually.

What if we would like to show different strings? How can we show one string on the DOM, and a completely different string on the console log?

First of all, we cannot have the same sync for both of these effects. We need to have two syncs. We need to change our main to return not just one common observable as the sync for both of them, but we need to return two observables.

How do we that? We can return an object, and this object will have two keys. One of them will be the DOM, and the other will be log.

This will be the observable sync for the DOM as an effect, can be the same thing we had before, and for the console log we can return something completely different. For instance, we can say, "Every two seconds, give a number."

We will have 0, and then 1, after the second second. Can even map these two, 2*i. Now we have two observables being returned by the main, and we need to use them.

Now we have these two syncs from the main, and we give the DOM sync to the DOM effect, and we give the log sync to the console log effect. This is ticking every second on the DOM, and then the console log, that is ticking every two seconds, an even number.

This is how we start to control which syncs go to which effects from our main. We want to put logic in our main. The logic is giving different strings to different effects.

HEY, QUICK QUESTION!
Joel's Head
Why are we asking?