From 7910805a96ed5e8c1ced1581a6585bec391da899 Mon Sep 17 00:00:00 2001 From: Christos Paschalidis Date: Tue, 19 Mar 2019 23:16:52 +0100 Subject: [PATCH 1/4] docs(ajax): describe your change... I have the feeling that since `ajax` is one of the useful operators we have in Rxjs for making requests etc etc it would be nice if the documentation have more examples. Therefore I opened this PR that will add few examples on Stackblitz. Please look here. I would be happy to hear your feedback since now I am gonna work on that in order to have this documented well for future referenced --- src/internal/observable/dom/ajax.ts | 69 ++++++++++++++++++++++++++++- 1 file changed, 68 insertions(+), 1 deletion(-) diff --git a/src/internal/observable/dom/ajax.ts b/src/internal/observable/dom/ajax.ts index c524c57adf..cb39564ec0 100644 --- a/src/internal/observable/dom/ajax.ts +++ b/src/internal/observable/dom/ajax.ts @@ -5,15 +5,82 @@ import { AjaxObservable, AjaxCreationMethod } from './AjaxObservable'; * It creates an observable for an Ajax request with either a request object with * url, headers, etc or a string for a URL. * + * + * ## Using ajax() to fetch the response object that is being returned from API. + * ```javascript + * import { ajax } from 'rxjs/ajax'; + * import { map, catchError } from 'rxjs/operators'; + * import { of } from 'rxjs'; + * + * const obs$ = ajax(`https://api.github.com/users?per_page=5`).pipe( + * map(userResponse => console.log('users: ', userResponse)), + * catchError(error => { + * console.log('error: ', error) + * return of(error) + * }) + * ); + * + * const subscribe = obs$.subscribe(); + * ``` + * * ## Using ajax.getJSON() to fetch data from API. * ```javascript * import { ajax } from 'rxjs/ajax'; * import { map, catchError } from 'rxjs/operators'; + * import { of } from 'rxjs'; * * const obs$ = ajax.getJSON(`https://api.github.com/users?per_page=5`).pipe( * map(userResponse => console.log('users: ', userResponse)), - * catchError(error => console.log('error: ', error)) + * catchError(error => { + * console.log('error: ', error) + * return of(error) + * }) * ); + * + * const subscribe = obs$.subscribe(); + * ``` + * + * ## Using ajax() with object as argument and method POST with a two seconds delay. + * ```javascript + * import { ajax } from 'rxjs/ajax'; + * import { of } from 'rxjs'; + * + * const users = ajax({ + * url: 'https://httpbin.org/delay/2', + * method: 'POST', + * headers: { + * 'Content-Type': 'application/json', + * 'rxjs-custom-header': 'Rxjs' + * }, + * body: { + * rxjs: 'Hello World!' + * } + * }).pipe( + * map(response => console.log('response: ', response)), + * catchError(error => { + * console.log('error: ', error) + * return of(error) + * }) + * ); + * + * const subscribe = obs$.subscribe(); + * ``` + * + * ## Using ajax() to fetch. An error object that is being returned from the request. + * ```javascript + * import { ajax } from 'rxjs/ajax'; + * import { map, catchError } from 'rxjs/operators'; + * import { of } from 'rxjs'; + * + * const obs$ = ajax(`https://api.github.com/404`).pipe( + * map(userResponse => console.log('users: ', userResponse)), + * catchError(error => { + * console.log('error: ', error) + * return of(error) + * }) + * ); + * + * const subscribe = obs$.subscribe(); * ``` */ export const ajax: AjaxCreationMethod = AjaxObservable.create; From 8e4ee219cec787a437bfeb44924720511253b219 Mon Sep 17 00:00:00 2001 From: christos Date: Wed, 20 Mar 2019 00:01:41 +0100 Subject: [PATCH 2/4] adds semicolons --- src/internal/observable/dom/ajax.ts | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/src/internal/observable/dom/ajax.ts b/src/internal/observable/dom/ajax.ts index cb39564ec0..118a083ce6 100644 --- a/src/internal/observable/dom/ajax.ts +++ b/src/internal/observable/dom/ajax.ts @@ -15,8 +15,8 @@ import { AjaxObservable, AjaxCreationMethod } from './AjaxObservable'; * const obs$ = ajax(`https://api.github.com/users?per_page=5`).pipe( * map(userResponse => console.log('users: ', userResponse)), * catchError(error => { - * console.log('error: ', error) - * return of(error) + * console.log('error: ', error); + * return of(error); * }) * ); * @@ -32,8 +32,8 @@ import { AjaxObservable, AjaxCreationMethod } from './AjaxObservable'; * const obs$ = ajax.getJSON(`https://api.github.com/users?per_page=5`).pipe( * map(userResponse => console.log('users: ', userResponse)), * catchError(error => { - * console.log('error: ', error) - * return of(error) + * console.log('error: ', error); + * return of(error); * }) * ); * @@ -58,8 +58,8 @@ import { AjaxObservable, AjaxCreationMethod } from './AjaxObservable'; * }).pipe( * map(response => console.log('response: ', response)), * catchError(error => { - * console.log('error: ', error) - * return of(error) + * console.log('error: ', error); + * return of(error); * }) * ); * @@ -75,8 +75,8 @@ import { AjaxObservable, AjaxCreationMethod } from './AjaxObservable'; * const obs$ = ajax(`https://api.github.com/404`).pipe( * map(userResponse => console.log('users: ', userResponse)), * catchError(error => { - * console.log('error: ', error) - * return of(error) + * console.log('error: ', error); + * return of(error); * }) * ); * From c790de586caf83b07fd55c2c0e8ef45ed288794f Mon Sep 17 00:00:00 2001 From: christos Date: Wed, 20 Mar 2019 00:01:57 +0100 Subject: [PATCH 3/4] removes subscribes --- src/internal/observable/dom/ajax.ts | 4 ---- 1 file changed, 4 deletions(-) diff --git a/src/internal/observable/dom/ajax.ts b/src/internal/observable/dom/ajax.ts index 118a083ce6..2f5c944cae 100644 --- a/src/internal/observable/dom/ajax.ts +++ b/src/internal/observable/dom/ajax.ts @@ -20,7 +20,6 @@ import { AjaxObservable, AjaxCreationMethod } from './AjaxObservable'; * }) * ); * - * const subscribe = obs$.subscribe(); * ``` * * ## Using ajax.getJSON() to fetch data from API. @@ -37,7 +36,6 @@ import { AjaxObservable, AjaxCreationMethod } from './AjaxObservable'; * }) * ); * - * const subscribe = obs$.subscribe(); * ``` * * ## Using ajax() with object as argument and method POST with a two seconds delay. @@ -63,7 +61,6 @@ import { AjaxObservable, AjaxCreationMethod } from './AjaxObservable'; * }) * ); * - * const subscribe = obs$.subscribe(); * ``` * * ## Using ajax() to fetch. An error object that is being returned from the request. @@ -80,7 +77,6 @@ import { AjaxObservable, AjaxCreationMethod } from './AjaxObservable'; * }) * ); * - * const subscribe = obs$.subscribe(); * ``` */ export const ajax: AjaxCreationMethod = AjaxObservable.create; From 43101b5a035af93ab3efdaa71290443fe1f6b111 Mon Sep 17 00:00:00 2001 From: christos Date: Fri, 22 Mar 2019 10:31:34 +0100 Subject: [PATCH 4/4] javascript to ts --- src/internal/observable/dom/ajax.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/internal/observable/dom/ajax.ts b/src/internal/observable/dom/ajax.ts index 2f5c944cae..059de0ab58 100644 --- a/src/internal/observable/dom/ajax.ts +++ b/src/internal/observable/dom/ajax.ts @@ -7,7 +7,7 @@ import { AjaxObservable, AjaxCreationMethod } from './AjaxObservable'; * * * ## Using ajax() to fetch the response object that is being returned from API. - * ```javascript + * ```ts * import { ajax } from 'rxjs/ajax'; * import { map, catchError } from 'rxjs/operators'; * import { of } from 'rxjs'; @@ -23,7 +23,7 @@ import { AjaxObservable, AjaxCreationMethod } from './AjaxObservable'; * ``` * * ## Using ajax.getJSON() to fetch data from API. - * ```javascript + * ```ts * import { ajax } from 'rxjs/ajax'; * import { map, catchError } from 'rxjs/operators'; * import { of } from 'rxjs'; @@ -39,7 +39,7 @@ import { AjaxObservable, AjaxCreationMethod } from './AjaxObservable'; * ``` * * ## Using ajax() with object as argument and method POST with a two seconds delay. - * ```javascript + * ```ts * import { ajax } from 'rxjs/ajax'; * import { of } from 'rxjs'; * @@ -64,7 +64,7 @@ import { AjaxObservable, AjaxCreationMethod } from './AjaxObservable'; * ``` * * ## Using ajax() to fetch. An error object that is being returned from the request. - * ```javascript + * ```ts * import { ajax } from 'rxjs/ajax'; * import { map, catchError } from 'rxjs/operators'; * import { of } from 'rxjs';