我是Angular2的新手。我已经参考了官方网站上给出的Hero Tutorial,并根据我的要求在Angular2中编写了以下HTTP post请求代码。我习惯了java-script并且我使用AJAX调用与web服务器交互,在javascript-AJAX调用中我们可以在成功的AJAX调用(回调函数)上执行一些功能。我如何在angular2中实现这一目标?我也想使用警报。每次通话成功/失败时,会显示一个警告框,说明其成功或失败。
@Injectable()
export class LicenceService {
constructor(private http: Http) {}
private headers = new Headers({'Content-Type': 'application/json'});
/* URL to web api*/
private licenceUrl = 'http://localhost:5000/***/****/installation/uploadLicense';
sendData(key: string){
return this.http
.post(this.licenceUrl, key, this.headers)
.toPromise()
.then(res => res.json().data)
.catch(this.handleError);
}
private static handleError (error: any) {
console.log(error);
return Promise.reject(error.json());
}
答案 0 :(得分:3)
您需要的只是代码
sendData(key: string){
return this.http
.post(this.licenceUrl, key, this.headers)
.toPromise()
.then(res => {
res.json().data;
// code here is executed on success
})
.catch(this.handleError);
}
或致来电者
this.sendData(somekey).then(result => /*put after after success code here */);
答案 1 :(得分:2)
虽然,您的问题已经得到解答,但这是保持Sevice和回调逻辑分离的另一种方法。我通过使用 subscibe 和可观察
来实现它这是我的 question.compnent.ts
ngOnInit() {
this.getQuestions();
}
getQuestions() {
this.yourService.getQuestions()
.subscribe(
data => this.displayData = data,
error => this.errorMessage = <any>error,
() => {
//this gets called on completion, callback code comes here
}
);
}
我的 question.service.ts 负责处理HTTP请求部分
getQuestions(): Observable<DisplayData[]>{
const endPoint = 'http://localhost:3000/yourApi';
return this.http.get(endPoint).map((response: Response) => response.json());
}
注意:this.displayData是DisplayData []类型的变量,用作Service中的observable。
对不起,很长的帖子。干杯:)