225. Loading the Shopping List Items into the Form

Jul 22, 2026 00:52 · 3:02 · English · Whisper Turbo · 2 Sprekers

Dit transcript verloopt in 8 dagen. Upgrade voor permanente opslag →

Lezingenindex

0:01

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

In the last lectures,

0:03

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

we did a lot of setup to get the information about the item we're

0:07

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

about to edit.

0:07

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

Now let's edit it.

0:09

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

I want to get the item we want to edit.

0:13

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

And for this,

0:14

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

in the shopping list service,

0:16

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

I'll need a new method,

0:17

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

which is simply get ingredient,

0:19

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

which expects to get the index,

0:22

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

a number,

0:23

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

and which will simply return us the ingredient

0:27

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

from our ingredients array.

0:29

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

So the ingredient at this index.

0:32

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

So with that returned,

0:33

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

we now can reach out to this new method in our shopping edit component

0:38

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

and store it in the edited item maybe,

0:41

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

which is an ingredient.

0:42

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

So type ingredient.

0:44

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

And we do this whenever we get a

0:48

S… Speaker 2 (225. Loading the Shopping List Items into the Form)

new method.

0:49

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

information that we're in the edit mode I should say so here edited item

0:54

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

will be set equal to reaching out to the shopping service to

0:58

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

the item we get from the get ingredient method and here we simply

1:02

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

pass our index so with this we got a lot of information

1:06

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

here now we need to update our form if we are in edit mode

1:11

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

and for this I want to get access to the form now on

1:15

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

the form we do have a local reference F

1:18

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

We can use this together with at viewchild to get access

1:22

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

to it.

1:23

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

So here I will actually use at viewchild and

1:27

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

make sure to add the import from at Angular core.

1:30

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

I will reach out to F and this will be

1:35

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

the shopping list form.

1:38

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

of type ng form.

1:40

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

So make sure to assign this type here.

1:43

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

Now,

1:44

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

once we got all the new information inside of the subscribe callback,

1:48

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

and that is of course important,

1:49

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

outside of there,

1:50

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

this will not be run each time we get a new information,

1:54

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

but it might be run before we got any information at all.

1:57

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

So outside would be wrong.

1:59

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

Inside of this callback here,

2:01

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

I want to reach out to my form and call

2:05

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

set value here.

2:07

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

and now i want to assign a new value for the name i

2:11

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

will use my edited item and here the name and

2:16

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

for amount you guessed it i'll also use my edited item and

2:20

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

then the amount and this should make sure that whenever we select a new

2:24

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

item we actually populate the form with the right values

2:29

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

we can already try this with ng serve running

2:34

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

Once our page reloads,

2:36

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

if I click here,

2:37

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

we indeed select the correct item.

2:41

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

So that is working as expected.

2:43

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

Of course,

2:44

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

it still adds it as a new item.

2:46

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

So we need to make sure that if we are editing,

2:49

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

we correctly rename this button to update or something like

2:53

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

this.

2:54

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

And that we then also do update the item and don't add a new one.

2:57

S… Speaker 1 (225. Loading the Shopping List Items into the Form)

Let's do this in the next lecture.

Dit transcript werd gegenereerd door AI (automatische spraakherkenning). Kan fouten bevatten..verifieer tegen de oorspronkelijke audio voor kritisch gebruik. AI-beleid

❤️ Hou je van STT.ai? Vertel het je vrienden!

Samenvatting

Klik op Summarize om een AI samenvatting van dit transcript te genereren.

Vraag AI over dit Transcript

Vraag maar iets over dit transcript De AI zal relevante secties en antwoord vinden.

Een andere transcriberen