ajax

2020-10-09 14:04 更新

Rx 對象上有一個 ajax 運算符。

const ajax: any;

描述

它使用以下請求對象創(chuàng)建 Ajax 請求的可觀察對象: 網(wǎng)址,標頭等或網(wǎng)址字符串。

使用 ajax()來獲取從 API 返回的響應對象。

  1. import { ajax } from 'rxjs/ajax';
  2. import { map, catchError } from 'rxjs/operators';
  3. import { of } from 'rxjs';
  4. const obs$ = ajax(`https://api.github.com/users?per_page=5`).pipe(
  5. map(userResponse => console.log('users: ', userResponse)),
  6. catchError(error => {
  7. console.log('error: ', error);
  8. return of(error);
  9. })
  10. );

使用 ajax.getJSON()從 API 獲取數(shù)據(jù)。

  1. import { ajax } from 'rxjs/ajax';
  2. import { map, catchError } from 'rxjs/operators';
  3. import { of } from 'rxjs';
  4. const obs$ = ajax.getJSON(`https://api.github.com/users?per_page=5`).pipe(
  5. map(userResponse => console.log('users: ', userResponse)),
  6. catchError(error => {
  7. console.log('error: ', error);
  8. return of(error);
  9. })
  10. );

將 ajax()與對象一起用作參數(shù),并將方法 POST 延遲兩秒鐘。

  1. import { ajax } from 'rxjs/ajax';
  2. import { of } from 'rxjs';
  3. const users = ajax({
  4. url: 'https://httpbin.org/delay/2',
  5. method: 'POST',
  6. headers: {
  7. 'Content-Type': 'application/json',
  8. 'rxjs-custom-header': 'Rxjs'
  9. },
  10. body: {
  11. rxjs: 'Hello World!'
  12. }
  13. }).pipe(
  14. map(response => console.log('response: ', response)),
  15. catchError(error => {
  16. console.log('error: ', error);
  17. return of(error);
  18. })
  19. );

使用ajax()獲取。 從請求返回的錯誤對象。

  1. import { ajax } from 'rxjs/ajax';
  2. import { map, catchError } from 'rxjs/operators';
  3. import { of } from 'rxjs';
  4. const obs$ = ajax(`https://api.github.com/404`).pipe(
  5. map(userResponse => console.log('users: ', userResponse)),
  6. catchError(error => {
  7. console.log('error: ', error);
  8. return of(error);
  9. })
  10. );
以上內容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號