本文实例讲述了angular2中Http请求原理与用法。分享给大家供大家参考，具体如下：
提供HTTP服务
@angular/http的独立附属模块中.
编辑app.module.ts
angular-in-memory-web-api
This in-memory web api service processes an HTTP request and returns an Observable of HTTP Response object in the manner of a RESTy web api.
之前测试时用的app/mock/user_data_memory_mock.ts数据
编辑app.module.ts
导入InMemoryWebApiModule并将其加入到模块的imports数组。 InMemoryWebApiModule将Http客户端模拟的后端服务
forRoot()配置方法需要UserMemoryMockService类实例，用来向内存数据库填充数据
编辑app/service/user.restful.service.ts
{
const url = `${this.USERURL}/?name=${name}`;
return this.http.get(url)
.toPromise()
.then(response => response.json().data as User)
.catch(this.handleError);
}
getUsers(): Promise {
console.log('Get User!');
return this.http.get(this.USERURL)
.toPromise()
.then(response => response.json().data as User[])
.catch(this.handleError);
}
create(name: string): Promise {
return this.http
.post(this.USERURL,JSON.stringify({name: name}),{headers: this.headers})
.toPromise()
.then(res => res.json().data as User)
.catch(this.handleError);
}
private handleError(error: any): Promise{
console.log('An error occurred :',error);
return Promise.reject(error.message);
}
}
编辑app/components/app-loginform/app.loginform.ts
this.users = users);
}
onSubmit(): void {
this.userService.getUserByName(this.model.name)
.then( user => {
console.log('user.name',user[0].name);
console.log('user.password',user[0].password);
if(user[0].name === this.model.name
&& user[0].password === this.model.password){
this.Log.log('login success!');
this.submitted = true;
}else{
this.Log.log('login failed!');
this.submitted = false;
}
})
.catch(errorMsg => console.log(errorMsg));
}
}
HTTP Promise
Angular 的http.get返回一个 RxJS 的Observable对象。 Observable是一个管理异步数据流的强力方式。
现在，我们先利用toPromise方法把Observable直接转换成Promise对象
更多关于AngularJS相关内容感兴趣的读者可查看本站专题：《》、《》及《》
希望本文所述对大家AngularJS程序设计有所帮助。
原文链接：https://www.f2er.com/js/34216.html