Observable Test Subj 2
Second Subject for Observables test
by Mario_Rivis
HTML
<script src="https://unpkg.com/@reactivex/[email protected]/dist/global/Rx.js"></script>
<input id="my-input" type="number">
<select id="select-box">
<option selected hidden> -- select a resource -- </option>
<option value="name">name</option>
<option value="username">username</option>
<option value="email">email</option>
<option value="companyName">companyName</option>
<option value="addressGeo">addressGeo</option>
</select>
JavaScript
/*
* You have an input field: my-input, which is of type number and a select item called select-box.
* The number represents the id of the user you want to get (a number between 1 and 10)
* The select tells us which field you of the specified user you are interested for
*
* For more details visit https://jsonplaceholder.typicode.com/
* Response example: https://jsonplaceholder.typicode.com/users/1 will give you details of the user with the id 1
*
* If the selectbox contains addressGeo, it should console.log {lat: "-37.3159", lng: "81.1496"}
* If the selectbox contains name, it should console.log Leanne Graham
* If the selectbox contins companyName, it should console.log Romaguera-Crona
* etc.
*
* When either one of the input changes, create an http request to get the requsted resource for the specified user
*
* HINT: you should map both observables to event -> event.target.value to get the value from the events
*/
const myInput = document.getElementById('my-input');
const selectBox = document.querySelector('#select-box');
const result = document.querySelector('#result');
const userId$ = Rx.Observable.fromEvent(myInput, 'input')//...
const resource$ = Rx.Observable.fromEvent(selectBox, 'change')//...
const subscription = Rx.Observable.combineLatest(userId$, resource$)
//...
.subscribe(
console.log,
err => console.log(err),
complete => console.log('complete'));