Как обращаться с кодами статуса http, отличными от 200 в Angular 2
Прямо сейчас, как я делаю http-запросы (заимствованные из этого ответа ), это:
POST(url, data) { var headers = new Headers(), authtoken = localStorage.getItem('authtoken'); headers.append("Content-Type", 'application/json'); if (authtoken) { headers.append("Authorization", 'Token ' + authtoken) } headers.append("Accept", 'application/json'); var requestoptions = new RequestOptions({ method: RequestMethod.Post, url: this.apiURL + url, headers: headers, body: JSON.stringify(data) }) return this.http.request(new Request(requestoptions)) .map((res: Response) => { if (res) { return { status: res.status, json: res.json() } } }); }
Это прекрасно работает, за исключением того, что angular2 не будет работать, если возвращаемый код состояния – это что-то другое, чем 200. Например, если пользователь хочет что-то публиковать, а сервер возвращает 400, угловое 2 выдает исключение:
неперехваченное исключение: [object Object]
Как я могу избежать этого? Я бы хотел обработать эти коды состояния в своем приложении, чтобы улучшить пользовательский интерфейс (показать ошибки и т. Д.),
- Угловой массив объектов для изменения данных
- Передача данных с предметами и прокси
- Расширитель компонентов с декоратором базового classа
- Как обновить / обновить с углового 4 до углового 5+
- Угловые 2+ и наблюдаемые: не могут привязываться к 'ngModel', поскольку это не известное свойство 'select'
- Angular 2 beta.17: Property 'map' не существует в типе 'Observable '
- Не удается найти внешний модуль «угловой2 / угловой2» - Angular2 w / Typcript
- Angularjs, проходящий между маршрутами
Да, вы можете обращаться с оператором catch таким образом и показывать предупреждение, как хотите, но во-первых, вам нужно импортировать Rxjs
же, как этот путь
import {Observable} from 'rxjs/Rx'; return this.http.request(new Request(this.requestoptions)) .map((res: Response) => { if (res) { if (res.status === 201) { return [{ status: res.status, json: res }] } else if (res.status === 200) { return [{ status: res.status, json: res }] } } }).catch((error: any) => { if (error.status === 500) { return Observable.throw(new Error(error.status)); } else if (error.status === 400) { return Observable.throw(new Error(error.status)); } else if (error.status === 409) { return Observable.throw(new Error(error.status)); } else if (error.status === 406) { return Observable.throw(new Error(error.status)); } }); }
также вы можете передать ошибку (с блоком err), которая выбрасывается блоком catch в то время как функция .map
,
как это –
... .subscribe(res=>{....} err => {//handel here});
Обновить
как требуется для любого состояния без проверки участника, вы можете попробовать следующее:
return this.http.request(new Request(this.requestoptions)) .map((res: Response) => { if (res) { if (res.status === 201) { return [{ status: res.status, json: res }] } else if (res.status === 200) { return [{ status: res.status, json: res }] } } }).catch((error: any) => { if (error.status < 400 || error.status ===500) { return Observable.throw(new Error(error.status)); } }) .subscribe(res => {...}, err => {console.log(err)} );