Exercise - AsyncSubject

Subject Variants

Exercise

The goal of the exercise is to capture the position of the mouse event when the capture button is clicked.

  1. Open exercise on codesandbox.
  2. I've already imported the AsyncSubject class for you.
  3. Create a new AsyncSubject instance and specify the generic type MouseEvent for the next notification value.
  4. Subscribe to the AsyncSubject instance and set the x and y input values to the event's pageX and pageY values accordingly. Since we're using TypeScript you'll need to properly set the value property to a string.
  5. Subscribe to the clicks Observable using the asyncSubject as the Observer.
  6. Finally, complete the AsyncSubject instance when the user has clicked on the button. You'll need to use the fromEvent() operator or add an event listener to the HTMLButtonElement.

Exercise - AsyncSubject

Subject Variants

Exercise

The goal of the exercise is to capture the position of the mouse event when the capture button is clicked.

  1. Open exercise on codesandbox.
  2. I've already imported the AsyncSubject class for you.
  3. Create a new AsyncSubject instance and specify the generic type MouseEvent for the next notification value.
  4. Subscribe to the AsyncSubject instance and set the x and y input values to the event's pageX and pageY values accordingly. Since we're using TypeScript you'll need to properly set the value property to a string.
  5. Subscribe to the clicks Observable using the asyncSubject as the Observer.
  6. Finally, complete the AsyncSubject instance when the user has clicked on the button. You'll need to use the fromEvent() operator or add an event listener to the HTMLButtonElement.

Copyright

Site © by LiveLoveApp, LLC

We Can Help!

Need help with RxJS in your project?

Hire Us