Mostra solo
0:02
S… Speaker 1 (192. TD Understanding Form State)
In the last lecture,
0:03
S… Speaker 1 (192. TD Understanding Form State)
we learned how we can submit a form created by Angular and how we
0:07
S… Speaker 1 (192. TD Understanding Form State)
can access to this object Angular created for
0:11
S… Speaker 1 (192. TD Understanding Form State)
us.
0:11
S… Speaker 2 (192. TD Understanding Form State)
Now,
0:12
S… Speaker 1 (192. TD Understanding Form State)
we had a look at the value property,
0:14
S… Speaker 1 (192. TD Understanding Form State)
which stores the input of the user in key value pairs.
0:18
S… Speaker 1 (192. TD Understanding Form State)
we see that we also have a lot of our properties.
0:21
S… Speaker 1 (192. TD Understanding Form State)
And that's pretty cool about this JavaScript object,
0:25
S… Speaker 1 (192. TD Understanding Form State)
about the form handling by Angular.
0:27
S… Speaker 1 (192. TD Understanding Form State)
It allows us to really understand the state of our
0:32
S… Speaker 1 (192. TD Understanding Form State)
form.
0:32
S… Speaker 1 (192. TD Understanding Form State)
We can see which controls we registered here on the controls
0:36
S… Speaker 1 (192. TD Understanding Form State)
object, email,
0:37
S… Speaker 1 (192. TD Understanding Form State)
secret, and username,
0:38
S… Speaker 1 (192. TD Understanding Form State)
and each control is of type form control.
0:41
S… Speaker 1 (192. TD Understanding Form State)
of course, a type made available by Angular,
0:43
S… Speaker 1 (192. TD Understanding Form State)
where each control then has a couple of properties,
0:46
S… Speaker 1 (192. TD Understanding Form State)
mostly the same properties we have on the overall form,
0:49
S… Speaker 1 (192. TD Understanding Form State)
though.
0:50
S… Speaker 1 (192. TD Understanding Form State)
And therefore,
0:51
S… Speaker 1 (192. TD Understanding Form State)
let's go back to that overall form.
0:53
S… Speaker 1 (192. TD Understanding Form State)
For example,
0:54
S… Speaker 1 (192. TD Understanding Form State)
properties like dirty,
0:55
S… Speaker 1 (192. TD Understanding Form State)
disabled,
0:56
S… Speaker 1 (192. TD Understanding Form State)
enabled,
0:57
S… Speaker 1 (192. TD Understanding Form State)
errors,
0:58
S… Speaker 1 (192. TD Understanding Form State)
and most of the properties should be pretty self -explanatory.
1:01
S… Speaker 1 (192. TD Understanding Form State)
Dirty,
1:02
S… Speaker 1 (192. TD Understanding Form State)
for example,
1:03
S… Speaker 1 (192. TD Understanding Form State)
is true because we changed something about that form.
1:06
S… Speaker 1 (192. TD Understanding Form State)
If I reload the page and submit it now,
1:10
S… Speaker 1 (192. TD Understanding Form State)
you will see that dirty is false because I didn't type into any
1:14
S… Speaker 1 (192. TD Understanding Form State)
input.
1:15
S… Speaker 1 (192. TD Understanding Form State)
So therefore,
1:16
S… Speaker 1 (192. TD Understanding Form State)
of course, dirty is false.
1:19
S… Speaker 1 (192. TD Understanding Form State)
Disabled would be true if the form was disabled for some reason.
1:23
S… Speaker 1 (192. TD Understanding Form State)
Invalid is false because we haven't added any validators.
1:27
S… Speaker 1 (192. TD Understanding Form State)
So it isn't invalid.
1:29
S… Speaker 1 (192. TD Understanding Form State)
It is indeed valid.
1:30
S… Speaker 1 (192. TD Understanding Form State)
You do have the valid property down here too.
1:32
S… Speaker 1 (192. TD Understanding Form State)
So the form is valid right now.
1:34
S… Speaker 1 (192. TD Understanding Form State)
We will later learn how to add validators to make sure that a valid
1:38
S… Speaker 1 (192. TD Understanding Form State)
email address has to be entered,
1:39
S… Speaker 1 (192. TD Understanding Form State)
for example.
1:42
S… Speaker 1 (192. TD Understanding Form State)
And we also have touched,
1:44
S… Speaker 1 (192. TD Understanding Form State)
for example,
1:45
S… Speaker 1 (192. TD Understanding Form State)
to see did we click into some of the fields.
1:47
S… Speaker 1 (192. TD Understanding Form State)
The difference to dirty would be that for dirty we have to change the field,
1:52
S… Speaker 1 (192. TD Understanding Form State)
have to change the value of a field.
1:54
S… Speaker 1 (192. TD Understanding Form State)
For touch we simply have to click into it and now it would be touched.
1:58
S… Speaker 1 (192. TD Understanding Form State)
And you will later learn how these properties can be helpful
2:02
S… Speaker 1 (192. TD Understanding Form State)
in...
2:03
S… Speaker 1 (192. TD Understanding Form State)
while changing the user experience.
2:05
S… Speaker 1 (192. TD Understanding Form State)
For example,
2:06
S… Speaker 1 (192. TD Understanding Form State)
disabling the submit button if the form is not valid.
2:10
S… Speaker 1 (192. TD Understanding Form State)
I will come back to this later.
2:11
S… Speaker 1 (192. TD Understanding Form State)
It's important to understand that you have all these properties and definitely
2:16
S… Speaker 1 (192. TD Understanding Form State)
feel free to dive into the output we logged here and
2:20
S… Speaker 1 (192. TD Understanding Form State)
understand which properties you have,
2:22
S… Speaker 1 (192. TD Understanding Form State)
how they change,
2:23
S… Speaker 1 (192. TD Understanding Form State)
which properties the individual controls have and so on.

Questa trascrizione è stata generata dall'AI (riconoscimento automatico del linguaggio). Può contenere errori Politica dell'IA

❤️ Ti piace STT.ai? Diccelo ai tuoi amici!
Sommario
Fare clic su Summarize per generare un riepilogo AI di questa trascrizione.
Riepilogando...
Chiedi all'AI Informazioni su questo trascrizione
Chiedere qualsiasi cosa su questa trascrizione L'AI troverà sezioni pertinenti e la risposta.