How to trigger didReceiveAttrs in Ember component

Using version 2.17. I have an Ember component inside an /edit route with a controller:

// edit.hbs

Inside my component, I am using a didRecieveAttrs hook to loop through ingredients on render, create proxy objects based off of each, and then build an ingredient table using those proxy objects.

// ingredient-table.js

didReceiveAttrs() {
  let uniqueIngredients = {};

  this.get('ingredients').forEach((ingredient) => {
    // do some stuff
  })

  this.set('recipeIngredients', Object.values(uniqueIngredients));
}

I also have a delete action, which I invoke when a user wishes to delete a row in the ingredient table. My delete action looks like this:

// ingredient-table.js

deleteIngredient(ingredient) {
  ingredient.deleteRecord();

  ingredient.save().then(() => {
    // yay! deleted!
  })
}

Everything mentioned above is working fine. The problem is that the deleted ingredient row remains in the table until the page refreshes. It should disappear immediately after the user deletes it, without page refresh. I need to trigger the didReceiveAttrs hook again. If I manually call that hook, all my problems are solved. But I don't think I should be manually calling it.

Based on the docs, it is my understanding that this hook will fire again on page load, and on re-renders (not initiated internally). I'm having some trouble figuring out what this means, I guess. Here's what I've tried:

1) calling ingredients.reload() in the promise handler of my save in ingredient-table.js (I also tried recipe.reload() here).

2) creating a controller function that calls model.ingredients.reload(), and passing that through to my component, then calling it in the promise handler. (I also tried model.reload() here).

Neither worked. Am I even using the right hook?