Angular 在组件中使用 get 请求填充反应形式

Question

我在创建一个更新组件时遇到问题，该组件从 url 读取传入的 id，发出 get 请求，并填充一个反应式表单。我可以确认 get 请求正在返回浏览器的网络选项卡中应有的内容。在我的服务中：productUrl= 'http://localhost:8080/api/products';  getProduct(id: number): Observable<Product> {    const url = `${this.productUrl}/${id}`;    return this.http.get<Product>(url);  }在我的组件中：  product: Product;  productForm= this.fb.group({    name: ['', Validators.required],    price: ['', Validators.required]  });  ngOnInit() {    this.getProduct();    console.log(this.product);    this.productForm.controls['name'].setValue(this.product.name);    this.productForm.controls['price'].setValue(this.product.price);  }  getProduct(): void {    const id = +this.route.snapshot.paramMap.get('id');    this.productService.getProduct(id)      .subscribe(product=> this.product = product);  }

Answer 1

你可以pathValue用价值

    this.productService.getProduct(id)

      .subscribe(product=> { 

                 this.product = product;

                 if (this.productForm) {

                     this.productForm.patchValue(this.product); 

                     //  this.productForm.patchValue(this.product, {emitEvent: false}); if you don't want valueChange on form be fired 

                 }

                });