title: How do I remove an object from an array with a matching property?
body: <p>Consider the following data:</p>
  
  <pre><code>food = {
    id: 1,
    name: 'Pizza',
    price: 16
  };
  
  orders = [
    { food_id: 2, table_id: 5 },
    { food_id: 2, table_id: 5 },
    { food_id: 1, table_id: 5 },
    { food_id: 3, table_id: 5 },
    { food_id: 1, table_id: 5 }
  ];
  </code></pre>
  
  <p>I want to remove a single item from the <strong>orders</strong> array matching <code>food_id</code>. Here's what I tried:</p>
  
  <pre><code>removeFoodOrder(food: Food): void {
    for (let order of this.orders) {
      let match = this.orders.filter((order) =&gt; order.food_id == food.id);
      match ? this.orders.splice(this.orders.indexOf(order), 1) : null;
      break;
    }
    console.log(this.orders);
  }
  </code></pre>
  
  <p>If I call <code>removeFoodOrder(food)</code>, it removes the first element from the array no matter what food item I pass in the params. </p>
  
  <pre><code>removeFoodOrder(food) 
  // removes {food_id: 2, table_id: 5} (the first element)
  // I want to remove {food_id: 1, table_id: 5},
  </code></pre>
  
  <p>I want to target the matching element from the array and remove a <strong>single</strong> instance of it. Where did I go wrong?</p>