Question

我是Angular 2的新手。我试图在API的响应之后渲染模板，但是我遇到的问题就像模板渲染后的API调用响应一样。

我的代码段的一部分是：

    ngOnInit() {
  let productId = this.route.snapshot.params['id'];

  this.CommonService.fetchData("http://192.168.1.107:9000/api/test/user/userId.json?id=" + productId).subscribe(
    (data) => {
      this.productData = data[0];
      console.log(this.productData);
    }
  )
  this.productAdd = this._formBuild.group({
    firstName: [this.productData["firstName"]],
    shortName: [this.productData["shortname"]],


  })
}
fetchData(url){ 
  return this.http.get(url).map(
    (res) => res.json()
  )
}

任何人都可以帮助我吗？

Answer 1

我们必须在调用Ajax API之前创建FormGroup。服务完成后会更新数据。

ngOnInit() {

   this.productAdd = this._formBuild.group({
       firstName: '',
       shortName: ''
   });

   let productId = this.route.snapshot.params['id'];
   this.CommonService
   .fetchData("http://192.168.1.107:9000/api/test/user/userId.json?id=" + productId)
        .subscribe((data) => {
            const result = data[0];
            this.productAdd.patchValue({
                firstName: result.firstName,
                shortName: result.shortName
            })
        });

});

<强>服务

fetchData(url){ 
    return this.http.get(url)
        .map((res)=>res.json());
}

Angular 2同步API调用

1 个答案: