125. Adding Ingredients to Recipes

Jul 15, 2026 05:15 · 3:42 · English · Whisper Turbo · 2 ஒலிப்பேழைகள்

இந்த பதிவு இன்று காலாவதியாகிறது. நிலையான சேமிப்புக்காக மேம்படுத்தல் →

0:02

S… Speaker 1 (125. Adding Ingredients to Recipes)

We're almost finished.

0:03

S… Speaker 1 (125. Adding Ingredients to Recipes)

Our application is taking shape and services really improved

0:07

S… Speaker 1 (125. Adding Ingredients to Recipes)

it. Now I want to do something here on the

0:11

S… Speaker 2 (125. Adding Ingredients to Recipes)

recipe section.

0:12

S… Speaker 1 (125. Adding Ingredients to Recipes)

I want each recipe to have some ingredients,

0:15

S… Speaker 1 (125. Adding Ingredients to Recipes)

so we need to implement this.

0:17

S… Speaker 1 (125. Adding Ingredients to Recipes)

And thereafter,

0:18

S… Speaker 1 (125. Adding Ingredients to Recipes)

I want to make this to shopping list button work so

0:22

S… Speaker 1 (125. Adding Ingredients to Recipes)

that we can send our ingredients to the shopping list.

0:25

S… Speaker 2 (125. Adding Ingredients to Recipes)

So to do this,

0:28

S… Speaker 2 (125. Adding Ingredients to Recipes)

What I will do is,

0:29

S… Speaker 2 (125. Adding Ingredients to Recipes)

first of all,

0:30

S… Speaker 2 (125. Adding Ingredients to Recipes)

I will work on the recipe model.

0:34

S… Speaker 1 (125. Adding Ingredients to Recipes)

It should now also have ingredients.

0:37

S… Speaker 1 (125. Adding Ingredients to Recipes)

So this will be of type ingredient array.

0:41

S… Speaker 1 (125. Adding Ingredients to Recipes)

Ingredient,

0:42

S… Speaker 1 (125. Adding Ingredients to Recipes)

of course, needs to be imported from the respective model file in the shared

0:46

S… Speaker 1 (125. Adding Ingredients to Recipes)

folder.

0:47

S… Speaker 1 (125. Adding Ingredients to Recipes)

And when we create a new instance of this

0:51

S… Speaker 1 (125. Adding Ingredients to Recipes)

model, I expect to get some ingredients here.

0:54

S… Speaker 1 (125. Adding Ingredients to Recipes)

Again, this will be of type ingredient array.

0:57

S… Speaker 1 (125. Adding Ingredients to Recipes)

so that here we can assign ingredients equal to the ingredients we get

1:01

S… Speaker 1 (125. Adding Ingredients to Recipes)

as an argument here.

1:02

S… Speaker 2 (125. Adding Ingredients to Recipes)

So with that,

1:03

S… Speaker 1 (125. Adding Ingredients to Recipes)

we are prepared to have some ingredients.

1:05

S… Speaker 2 (125. Adding Ingredients to Recipes)

Now in the recipe service,

1:08

S… Speaker 1 (125. Adding Ingredients to Recipes)

I also need to add some here.

1:09

S… Speaker 1 (125. Adding Ingredients to Recipes)

So when we create a new recipe,

1:12

S… Speaker 1 (125. Adding Ingredients to Recipes)

and I'll simply structure this over multiple lines to make it easier to read,

1:16

S… Speaker 1 (125. Adding Ingredients to Recipes)

I also now will pass an array of ingredients,

1:19

S… Speaker 1 (125. Adding Ingredients to Recipes)

the same for the second recipe here.

1:24

S… Speaker 1 (125. Adding Ingredients to Recipes)

And now I guess it's time to also turn this into some real recipes.

1:28

S… Speaker 1 (125. Adding Ingredients to Recipes)

So let me quickly do this.

1:29

S… Speaker 1 (125. Adding Ingredients to Recipes)

So I quickly change the pictures in the text to have a schnitzel and

1:34

S… Speaker 1 (125. Adding Ingredients to Recipes)

a burger here.

1:34

S… Speaker 1 (125. Adding Ingredients to Recipes)

And now let's add some ingredients here in this array of ingredients.

1:38

S… Speaker 1 (125. Adding Ingredients to Recipes)

We can use the ingredient constructor for this.

1:41

S… Speaker 1 (125. Adding Ingredients to Recipes)

And of course,

1:42

S… Speaker 1 (125. Adding Ingredients to Recipes)

we need to import the ingredient type here from the model file located

1:46

S… Speaker 1 (125. Adding Ingredients to Recipes)

in the shared folder for that.

1:47

S… Speaker 1 (125. Adding Ingredients to Recipes)

And now for the schnitzel,

1:49

S… Speaker 1 (125. Adding Ingredients to Recipes)

let's say we need the meat.

1:51

S… Speaker 1 (125. Adding Ingredients to Recipes)

with an amount of one maybe.

1:53

S… Speaker 1 (125. Adding Ingredients to Recipes)

And then we also want to have some French

1:57

S… Speaker 1 (125. Adding Ingredients to Recipes)

fries here.

1:59

S… Speaker 1 (125. Adding Ingredients to Recipes)

Let's say exactly 20.

2:01

S… Speaker 1 (125. Adding Ingredients to Recipes)

With one extra,

2:02

S… Speaker 1 (125. Adding Ingredients to Recipes)

it would probably not taste well,

2:04

S… Speaker 1 (125. Adding Ingredients to Recipes)

I guess.

2:04

S… Speaker 1 (125. Adding Ingredients to Recipes)

So now with the array for the burger,

2:08

S… Speaker 1 (125. Adding Ingredients to Recipes)

here we also need a new ingredient.

2:10

S… Speaker 1 (125. Adding Ingredients to Recipes)

We need the buns,

2:12

S… Speaker 1 (125. Adding Ingredients to Recipes)

so the bread basically.

2:13

S… Speaker 2 (125. Adding Ingredients to Recipes)

Let's say two.

2:16

S… Speaker 1 (125. Adding Ingredients to Recipes)

And we also want to have the meat here.

2:19

S… Speaker 1 (125. Adding Ingredients to Recipes)

Of course, feel free to add more ingredients.

2:21

S… Speaker 1 (125. Adding Ingredients to Recipes)

So now that we added that in the recipe detail

2:26

S… Speaker 1 (125. Adding Ingredients to Recipes)

component here,

2:27

S… Speaker 1 (125. Adding Ingredients to Recipes)

where we have this ingredients placeholder,

2:30

S… Speaker 1 (125. Adding Ingredients to Recipes)

we can actually now output them here.

2:33

S… Speaker 1 (125. Adding Ingredients to Recipes)

So let's add something here.

2:36

S… Speaker 1 (125. Adding Ingredients to Recipes)

Let's add an unordered list with a class of list group.

2:40

S… Speaker 1 (125. Adding Ingredients to Recipes)

And now here,

2:41

S… Speaker 1 (125. Adding Ingredients to Recipes)

I want to add a list group item.

2:45

S… Speaker 1 (125. Adding Ingredients to Recipes)

This item here will actually be replicated because

2:49

S… Speaker 1 (125. Adding Ingredients to Recipes)

again, this will of course be my ingredient.

2:52

S… Speaker 1 (125. Adding Ingredients to Recipes)

So here ng4 and now I will loop through all the ingredients.

2:57

S… Speaker 1 (125. Adding Ingredients to Recipes)

So ingredient off and now off recipe ingredients,

3:01

S… Speaker 1 (125. Adding Ingredients to Recipes)

of course, because remember in the recipe detail component we have a

3:05

S… Speaker 1 (125. Adding Ingredients to Recipes)

recipe and that has some ingredients since a couple of seconds at least.

3:09

S… Speaker 1 (125. Adding Ingredients to Recipes)

So now we can simply use string interpolation here

3:13

S… Speaker 1 (125. Adding Ingredients to Recipes)

to output the ingredient name and then maybe

3:18

S… Speaker 1 (125. Adding Ingredients to Recipes)

separate by a dash the amount.

3:21

S… Speaker 1 (125. Adding Ingredients to Recipes)

Of course, any format you like.

3:23

S… Speaker 2 (125. Adding Ingredients to Recipes)

So that's the first step.

3:26

S… Speaker 1 (125. Adding Ingredients to Recipes)

Now if we select the recipe,

3:28

S… Speaker 1 (125. Adding Ingredients to Recipes)

we see a list of ingredients at the bottom.

3:30

S… Speaker 1 (125. Adding Ingredients to Recipes)

Now I want to send these to the shopping list if I click

3:35

S… Speaker 1 (125. Adding Ingredients to Recipes)

this to shopping list button.

3:36

S… Speaker 1 (125. Adding Ingredients to Recipes)

So that is what we'll work on in the next lecture.

இந்த ஒலிப்பதிவு AI (தானியங்கி பேச்சு அடையாளம்) மூலம் உருவாக்கப்பட்டது. பிழைகள் இருக்கலாம் - முக்கியமான பயன்பாட்டுக்கு மூல ஒலியை சரிபார்க்கவும். AI கொள்கை

❤️ STT.ai ஐ நேசிக்கிறீர்களா? உங்கள் நண்பர்களுக்குச் சொல்லுங்கள்!

சுருக்கம்

இந்த நகலெடுப்புக்கான AI சுருக்கத்தை உருவாக்க சுருக்கம் என்பதை க்ளிக் செய்யவும்.

இந்த நகலை AI க்குக் கேட்கவும்

இந்த நூலைப் பற்றி ஏதாவது கேட்கவும் - AI தொடர்புடைய பகுதிகளைக் கண்டுபிடித்து பதிலளிக்கும்.

மற்றொன்றை மாற்று