我的 Angular2 应用程序有点问题。我想从服务器获取一些数据用于我的用户登录,但我的代码正在运行,但我有很多错误。我想等待服务器的回答,然后对我的数据做一些事情。
这是我的代码:
import { Injectable } from '@angular/core';
import { Http, Response, Headers } from '@angular/http';
import { Observable } from 'rxjs/Rx';
import { User } from './user';
@Injectable()
export class UserService {
public usersTmp: Array<Object> = new Array<Object>();
public users: Array<User>;
public user: User = new User();
public noteToSend;
constructor(private http: Http) { }
getUsers() {
var headers = new Headers();
headers.append('Accept', 'q=0.8;application/json;q=0.9');
this.http.get('/AngularApp/api/users', { headers: headers })
.map((res: Response) => res.json())
.subscribe(
data => {
console.log(data);
this.usersTmp = data;
},
err => console.error(err),
() => console.log('done')
);
this.users = new Array<User>();
for (var i = 0; i < this.usersTmp.length; i++) {
this.user = new User();
this.user.id = this.usersTmp[i]["userId"];
this.user.name = this.usersTmp[i]["userName"];
this.user.email = this.usersTmp[i]["userEmail"];
this.user.pass = this.usersTmp[i]["userPassword"];
this.users.push(this.user);
}
return this.users;
}
因为我注意到我的代码将进入 for 循环,直到我从服务器得到答案,所以我只返回空数组。任何人都可以帮助我吗?
最佳答案
在服务中,您应该返回您的组件可以订阅的Observable
。由于 get
请求的异步模式,它无法按照您的方式工作。
作为提议,您的服务可能与此类似
getUsers() {
let headers = new Headers();
headers.append('Accept', 'q=0.8;application/json;q=0.9');
return this.http.get('/AngularApp/api/users', { headers: headers })
.map((res: Response) => res.json());
}
你的组件的相关部分是这样的:
constructor(private userService:UserService) {
this.userService.getUsers().subscribe(
data => this.iterateOverUsers(data));
}
iterateOverUsers(data) {
// here comes your for loop
}
关于http - 在 Angular 2 中等待服务器对 http 请求的答复,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38316300/