Asynchronous Angular2-函数后更新变量（承诺？）

我有个问题。在我的注册中，如果数据库中已经存在用户，我想查看错误消息。所以我创建了“serverAnswer”变量，它将处理来自服务器的错误答案

我的register.service.ts内容

@Injectable()
export class RegisterService {
  constructor(private http: Http) {}

  public serverAnswer: Object;

  getAnswer() {
    return this.serverAnswer;
  }

  addUser(user: User) {
    var headers = new Headers();
    headers.append('Content-type', 'application/json');

    this.http.post('/users/register', JSON.stringify(user), {headers: headers})
    .subscribe(
      response => {
        if(response.json().success) {
          window.location.href = "/";
        }
        if(response.json().error) {
          this.serverAnswer = response.json();
        }
      }
    )
  }
}

如您所见，开始时“serverAnswer”变量为空。“response.json（）.error”处理我的错误文本。好的，现在是显示register.component.ts内容的时候了

export class RegisterComponent {
  constructor(private http: Http, private registerService: RegisterService) {}

  serverAnswer: Object;

  onSubmit(userName: string, userPassword: string, userEmail: string) {
    this.registerService.addUser(new User(userName, userPassword, userEmail))
    this.serverAnswer = this.registerService.getAnswer();
  }
}

问题是RegisterService中的“systemAnswer”在函数addUser完成之前已经更新。结果是，如果该用户已经存在于数据库中，那么第一次“systemAnswer”为空，第二次处理response.json（）.error文本

这个地方：

this.registerService.addUser(new User(userName, userPassword, userEmail))
this.serverAnswer = this.registerService.getAnswer();

只有在完成addUser函数时，我应该如何更新serverAnswer变量

---

谢谢你的帮助

如果您从您的服务中返回可观察的对象会更好：

@Injectable()
export class RegisterService {
  constructor(private http: Http) {}

  addUser(user: User) {
    var headers = new Headers();
    headers.append('Content-type', 'application/json');

    return this.http.post('/users/register', JSON.stringify(user), {headers: headers})
        .map(response => response.json());
  }
}

然后在控制器中使用它：

export class RegisterComponent {
    constructor(private http: Http, private registerService: RegisterService) {}

    serverAnswer: Object;

    onSubmit(userName: string, userPassword: string, userEmail: string) {
        this.registerService.addUser(new User(userName, userPassword, userEmail))
            .subscribe(
                response => {
                    if (response.success) {
                        window.location.href = "/";
                    } else if (response.error) {
                        this.serverAnswer = response;
                    }
                }
            );
    }
}

---

如果您从服务中返回可观察对象，效果会更好：

@Injectable()
export class RegisterService {
  constructor(private http: Http) {}

  addUser(user: User) {
    var headers = new Headers();
    headers.append('Content-type', 'application/json');

    return this.http.post('/users/register', JSON.stringify(user), {headers: headers})
        .map(response => response.json());
  }
}

然后在控制器中使用它：

export class RegisterComponent {
    constructor(private http: Http, private registerService: RegisterService) {}

    serverAnswer: Object;

    onSubmit(userName: string, userPassword: string, userEmail: string) {
        this.registerService.addUser(new User(userName, userPassword, userEmail))
            .subscribe(
                response => {
                    if (response.success) {
                        window.location.href = "/";
                    } else if (response.error) {
                        this.serverAnswer = response;
                    }
                }
            );
    }
}

---

嘿，谢谢你的回答。我有一个问题，

属性'subscribe'在类型'void'上不存在。

我想我应该导入一些rxjs模块？你需要在控制器中订阅，我想，我更新了答案。现在订阅可以工作，但

类型错误：this.http.post（…）.map不是一个函数

好的，我已经导入了导入'rxjs/add/operator/map'；而且效果很好。非常感谢。请注意，Angular 2的最终版本将使用没有

.map

方法的可见光。你已经被警告了。嘿，谢谢你的回答。我有一个问题，

属性'subscribe'在类型'void'上不存在。

我想我应该导入一些rxjs模块？你需要在控制器中订阅，我想，我更新了答案。现在订阅可以工作，但

类型错误：this.http.post（…）.map不是一个函数

好的，我已经导入了导入'rxjs/add/operator/map'；而且效果很好。非常感谢。请注意，Angular 2的最终版本将使用没有

.map

方法的可见光。你已经被警告了。