时间戳

首页 > 解决方案 > 我想在以角度更新我的产品数量后更新我的视图

angular - 我想在以角度更新我的产品数量后更新我的视图

问题描述

我创建了一个 UI，其中显示了产品列表，并且有用于更新产品数量的更新按钮（get 和 update 方法都将访问我的数据库）。现在我已经成功渲染了 productlist，并且我的更新功能也在工作。问题是更新我的产品后视图没有显示当前数据。页面重新加载或点击更新按钮 2-3 次需要更新我的视图。尝试使用像 this.productList=[...this.productList, res] 但显示错误。这是我到目前为止所做的

用于获取产品

productList: any;

  ngOnInit(): void {
 
    this.getProduct();
  }

getProduct() {
    let body = {
      filterBy: 'old',
      searchKey: '',
    };
    this._productSs.getProductList(body).subscribe((res: any) => {
      res.data.forEach((element: any) => {
        Object.assign(element, { count: 0 });
      });
     
      this.productList = res;
   
    });

更新方法

  updateQuantity(count: any, id: any) {
    let body = {
      productId: id,
      quantity: count.toString(),
    };
    let productId = id;
    let quantity = count.toString();
  
    this._productSs.updateQuantity(quantity, productId).subscribe((res) => {
      if (res.message == 'SUCCESS') {
        this.getProduct();
      }
    });
  }

html: <div class="container" *ngFor="let item of productList.data;let i=index">

在更新方法中，我调用 getProduct() 并获取更新的产品值

标签： angularngforangular12

解决方案

问题可能是由于Object.assign，因为它在分配计数后返回更新的对象元素，在您的情况下，它更新值但返回的对象未分配回元素。

尝试这个：

this._productSs.getProductList(body).subscribe((res: any) => {
      res.data.forEach((element: any) => {

        element = Object.assign(element, { count: 0 });

      });

推荐阅读