242. Deleting Ingredients and Some Finishing Touches

Jul 22, 2026 00:55 · 3:34 · English · Whisper Turbo · 2 স্পিকার

এই ট্ৰান্সক্ৰিপ্টৰ মেয়াদ শেষ হয় 8 দিন স্থায়ী সংৰক্ষণৰ বাবে উন্নীত কৰক →

পাঠৰ সূচী

0:02

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

We're almost done fixing bugs.

0:03

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

Our recipe service is now working as expected.

0:07

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

If we switch back and forth,

0:08

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

the spaghetti are there.

0:09

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

But now if we go back to recipe edit component,

0:13

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

this delete button,

0:15

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

this X here is not working.

0:17

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

First of all,

0:19

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

it's even submitting our form and we definitely don't want that.

0:22

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

So we should set the type to button.

0:24

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

Then I'll also add a click listener and say on

0:28

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

delete ingredient.

0:31

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

And here,

0:32

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

of course, I should pass the information which ingredients should get

0:36

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

deleted.

0:36

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

So I should pass the index i,

0:40

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

which is simply the index of the control we want to

0:44

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

remove.

0:45

S… Speaker 2 (242. Deleting Ingredients and Some Finishing Touches)

With that,

0:47

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

we can implement the onDeleteIncredient method in

0:51

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

our TypeScript file here.

0:53

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

And I know that I will receive the index here.

0:57

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

Number.

0:59

S… Speaker 2 (242. Deleting Ingredients and Some Finishing Touches)

Now with that,

1:00

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

I can get access to my recipe form to call

1:05

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

the get method and get access to my ingredients,

1:07

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

which I know is a form erasal.

1:09

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

Let's cast it as we did earlier too.

1:12

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

And now we can call the removeAt method and

1:16

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

pass the index to remove a specific form control,

1:19

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

the one at the position we want to delete.

1:21

S… Speaker 2 (242. Deleting Ingredients and Some Finishing Touches)

Now with that in place,

1:24

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

we can save this.

1:28

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

And now if we open a recipe and edit it

1:32

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

and remove this,

1:34

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

now you see it indeed removed the ingredient.

1:37

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

So now we updated the recipe and therefore we only sent

1:42

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

the french fries to the shopping list.

1:43

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

And again,

1:44

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

the other bug we had before is fixed.

1:47

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

Our recipes survive.

1:49

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

Now to clean this app up,

1:51

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

there's one other thing I forgot to do earlier.

1:54

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

In the recipe list component where we subscribe to our recipes

1:58

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

changed event here.

2:00

S… Speaker 2 (242. Deleting Ingredients and Some Finishing Touches)

Well,

2:01

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

we should unsubscribe if the component gets destroyed.

2:04

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

So let's implement on destroy and import this from at

2:08

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

AngularCore.

2:09

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

And then I will add ng on destroy here.

2:14

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

And I want to store the subscription in a property named

2:18

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

subscription of type subscription,

2:20

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

which needs to be imported from RxJS subscription.

2:25

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

And then I can store it

2:29

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

by assigning it as a value here in onInit.

2:32

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

The subscription is assigned.

2:34

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

And in onDestroyed,

2:36

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

I can now unsubscribe again to make sure

2:41

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

I don't cause any memory leaks here.

2:45

S… Speaker 2 (242. Deleting Ingredients and Some Finishing Touches)

So with that,

2:46

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

with all these bug fixes we added,

2:48

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

our app is looking great.

2:50

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

It should work fine now.

2:52

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

We can add new recipes here.

2:55

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

We can edit existing ones.

2:58

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

We can remove the ingredients there and add

3:02

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

new ingredients if we want,

3:04

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

of course.

3:05

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

We can then use them and send them to the shopping list.

3:08

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

There we can delete them.

3:10

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

We can add new items or decide otherwise

3:14

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

and clear the form.

3:15

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

Our forms are working great here and use quite

3:19

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

a lot of useful tools you may use in your next application,

3:23

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

which are great to enhance it and to offer a great

3:27

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

user experience.

3:28

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

With that,

3:29

S… Speaker 1 (242. Deleting Ingredients and Some Finishing Touches)

let's move on to the next course section.

এই অনুলিপি AI (স্বয়ংক্ৰিয় কথোপকথন স্বীকৃতি) দ্বাৰা সৃষ্টি কৰা হৈছে। ইয়াৰ অন্তৰ্গত ত্ৰুটি থাকিব পাৰে - গুৰুত্বপূৰ্ণ ব্যৱহাৰৰ বাবে মূল অডিঅ'ৰ সৈতে পৰীক্ষা কৰক। AI নীতি

❤️ STT.ai ভাল পায়? আপোনাৰ বন্ধুসকলক কওক!

সাৰাংশ

এই ট্ৰান্সক্ৰিপ্টৰ AI সাৰাংশ সৃষ্টি কৰিবলৈ সাৰাংশ ক্লিক কৰক।

এই অনুলিপিৰ বিষয়ে AI ক প্ৰশ্ন কৰক

এই অনুবাদৰ বিষয়ে যিকোনো প্ৰশ্ন কৰক — AI-এ প্ৰযোজ্য অংশসমূহ বিচাৰি পাব আৰু উত্তৰ দিব।

অন্য এটা অনুলিপি কৰক