Question

我将从API返回的数据分配给名为today的变量，我试图对其执行删除功能，但我总是遇到此错误Cannot read property 'id' of undefined

数据

[
    {
        "id":324,
        "firstName":"Chris",
        "lastName":"Jake",
        "orders":[
            {
                "id":162,
                "meals":[
                    {
                        "id":27,
                        "name":"French Fries",
                        "description":"test",
                    },
                    {
                        "id":28,
                        "name":"Plain Rice, Beans and Fish",
                        "description":"test",
                    }
                ],
                "serveDate":"2019-07-16 00:00:00"
            }
        ]
    }
]

功能

delete() {
    for (let r = 0; r < this.today.length; r++) {
        if (this.today[r].orders[r].id === this.orderId) {
            this.today.splice(r, 1);
        }
    }
}

Answer 1

您的“ serverDate”也是数组的元素，并且没有id，因此会出现此错误。如果未定义，order [r] .id将返回false。

  delete() {
      for (let r = 0; r < this.today.length; r++) {
            if (this.today[r].orders[r].id && 
                this.today[r].orders[r].id ===   this.orderId) {
                this.today.splice(r, 1);
            }
      }
  }

Answer 2

尝试这样：

 delete() {
    this.today.forEach((el, i) => {
      el.orders.forEach((order, j) => {
        if (order.id == this.orderId) {
          this.today[i].orders.splice(j,1);
        }
      })
    })
  }

Answer 3

从技术上讲，您可以在角度服务中接收JSON对象，并且可以删除此类数据。

const data =  `[{
    "id":324,
    "firstName":"Chris",
    "lastName":"Jake",
    "orders":[
        {
            "id":162,
            "meals":[
                {
                    "id":27,
                    "name":"French Fries",
                    "description":"test"
                },
                {
                    "id":28,
                    "name":"Plain Rice, Beans and Fish",
                    "description":"test"
                }
            ],
            "serveDate":"2019-07-16 00:00:00"
        }
    ]
}]`;

let parse = JSON.parse(data); console.log(parse);

const orderid = 27;
console.log(parse[0].orders[0].meals);
for(let i = 0; i < parse[0].orders[0].meals.length; i++ ) {
    if(parse[0].orders[0].meals[i].id == orderid) {
        parse[0].orders[0].meals.splice(i, 1)
    }
}
console.log(parse)

但是，如果您知道自己的http端点，则有更简单的方法。

用餐界面

export interface meal{
    id: num | string;
    name: string;
    description: string
}

订单界面

export interface order{
    id: num | string;
    meals: meal[];
    serveDate: string;
}

数据接口

export interface data {
    id: num|string;
    firstname: string;
    lastname: string;
    orders: order[];
}

为您服务 this.http.get（this.dataurl）

因此，基本上，您可以在订阅后通过模型查看json模型

this.http.get<data[]>(this.dataurl).subscribe(result => {
    if(result != null) {
        for(let u of result)
        {
            for(let o of u.orders)
            {
                for(let m of o.meals)
                {
                    if(orderid === m.id)
                    {
                     //remove your item from array
                    }
                }
            }
        }
    }
});

Answer 4

我不同意其他答案。 “ serverDate不是orders数组的元素。它是orders数组中第一个对象的元素。我认为您犯错的地方是您的for循环结构。要了解这一点，让我们分解一下每个循环的情况：

for (let r = 0; r < today.length; r++) {
    if (today[r].orders[r].id === this.orderId) {
        today.splice(r, 1);
    }
}

//r == 0
today[r].orders[r].id === this.orderId //grabs the 0th element of the today array and the 0th element of the orders array

//r == 1
today[r].orders[r].id === this.orderId //grabs the 1st element of the today array and the 1st element of the orders array

//!! the rest of the orders in today[0] and the order at location today[1].order[0] are skipped!!

为了防止出现此问题，应使用嵌套的for循环。

for (let r = 0; r < today.length; r++) { 
    for (let s=0 ; s < today[r].orders.length; s++) { 
        if (today[r].orders[s].id===t his.orderId) { 
            //splice whichever you want r for the day, s for the order 
        }
    }
}

从数组集合中删除子对象

4 个答案: