源代碼：

import { Component, OnInit } from '@angular/core'; import { FormControl } from '@angular/forms'; import { HttpClient } from '@angular/common/http';const ENDPOINT = "http://localhost:3000/echo?data=";@Component({selector: 'jerryform',template: `<input type="text" [formControl]="favoriteColorControl">` }) export class ReactFormComponent implements OnInit {constructor(private http:HttpClient){}ngOnInit(): void {this.favoriteColorControl.valueChanges.subscribe((value) =>{console.log('new value: ' + value);this.http.get('http://localhost:3000/angular/' + value).subscribe((response)=>console.log('response from http: ' + response),(error)=>console.log('error: ' + error));})}favoriteColorControl = new FormControl(''); }

nodejs實現(xiàn)的后臺API代碼：

app.route('/angular/*').get(function(req, res){var sResponse = 'Hello World';var oResponse = {"success:":"ok"};setTimeout( ()=>res.send(sResponse), 1000);});

測試發(fā)現(xiàn)，這個HTTP請求在Chrome開發(fā)者工具里標(biāo)注為成功：

然后我Angular代碼里觸發(fā)的是error handler，而不是期望中的success handler：

從錯誤明細(xì)能看出，Angular期望API返回的response是json結(jié)構(gòu)：Unexpected token H in JSON at position 0

觀察HTTP請求頭部字段里的Accept：application/json：

返回一個json格式的response即可：

更多Jerry的原創(chuàng)文章，盡在：“汪子熙”:

總結(jié)

以上是生活随笔為你收集整理的关于Angular使用http发送请求后的响应处理的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。