Knowing this makes Angular typed forms WAY less awkward

  Рет қаралды 10,329

Joshua Morony

Joshua Morony

Күн бұрын

Пікірлер: 33
@JoshuaMorony
@JoshuaMorony Жыл бұрын
Join my mailing list for more exclusive content and access to the archive of my private tips of the week: mobirony.ck.page/4a331b9076
@fejugaism
@fejugaism Жыл бұрын
Your're sooo saving my life. My forms look pretty ugly because of this problem. Some refactoring ison the way! Thanks!
@spencereaston8292
@spencereaston8292 2 жыл бұрын
Hi my name is Spencer, and I've been hurt by Angular forms. Its been two weeks since I was last hurt and hopefully with the support from this group that will be longer and longer.
@JoshuaMorony
@JoshuaMorony 2 жыл бұрын
Hi Spencer, we are all here to listen to your story when you are ready to share
@krasserTerror
@krasserTerror 3 ай бұрын
Hi Spencer, welcome to the group.
@ToLazyToThink0
@ToLazyToThink0 2 жыл бұрын
One thing to be aware of with getRawValue() is that it always creates a new object. Not a concern when used as shown, but when used in a template where it gets called every change detection cycle, or in an rxjs pipeline with distinctUntilChanged you might run into issues.
@infodusha
@infodusha Жыл бұрын
I would primary use form.controls.controlName.value in templates, so i mostly will have non-object values that are not undefined tho
@sfhaney24
@sfhaney24 2 жыл бұрын
Your reset method made me question how I'm setting form values in a create/edit type form that I'm reusing. Normally I set the form group first irrespective of the 'model' (in an edit mode) and then I have an observable that uses the id in the URL to set the form model values. If I passed in the model values when initializing the form group would reset then just revert the values back to the model automatically? I've been keeping the original model persisted for that purpose but your reset comments made me wonder. Also now I'm questioning if how I'm setting the form values from the model in an edit scenario is a bad practice. If you have any videos on best practices for hydrating a form from a model that'd be great. Love the videos btw. Thanks!
@JoshuaMorony
@JoshuaMorony 2 жыл бұрын
If I am understanding your scenario correctly - if you supplied the values from your model as the initial values for the control, then a reset (in a nonNullable form) should change those values back to the original model values that were supplied. I don't have any links to anything on that topic though!
@josiampokera5977
@josiampokera5977 Жыл бұрын
Am just enjoing your videos.. so helpfull
@JRiyaz
@JRiyaz 2 жыл бұрын
Hi! I found your videos very interesting and engaging. I request you to make a video on Micro Frontends using Module Federation.
@Lamevire
@Lamevire 2 жыл бұрын
I didn't know about nonNullable forms. I usually just wrote getters for each control value and throw an exception when it's null (which never happens).
@hundvd_7
@hundvd_7 2 жыл бұрын
Just looked it up, it's an Angular 14 feature
@norhansodod3059
@norhansodod3059 2 жыл бұрын
Thank you it works with me
@alextiger548
@alextiger548 2 жыл бұрын
Hey Josh, you have a link to your example where you use this nonNullable v14 stuff?
@JoshuaMorony
@JoshuaMorony 2 жыл бұрын
Sorry this one is from the course I am working on so I don't have a public link for this at the moment!
@alextiger548
@alextiger548 2 жыл бұрын
@@JoshuaMorony i got it. build some myself to paly with. this 'nonNullable ' is super useful
@AkxeOne
@AkxeOne 2 жыл бұрын
The reason that .value is different from .getRawValue() is: When an input in the form is disabled. In the value, its value will be undefined. In raw value, it will get its value regardless of the disabled state. Would be nice if it was mentioned.
@JoshuaMorony
@JoshuaMorony 2 жыл бұрын
I do mention this at 3:54
@Simon_IHG
@Simon_IHG 2 жыл бұрын
By the way, this logic should be changed as for me a "disabled" field does not mean that you don't want to get the value from the form. For some reason, a field can become disabled as some other field's value change.
@mykolakozachenko4916
@mykolakozachenko4916 Жыл бұрын
great video
@mohamedyassineajami6228
@mohamedyassineajami6228 2 жыл бұрын
I love how a lot of people in the comment section, are speaking about form reset(). The same happened to me. And by the way, my name is Yasin, and I was hurt by angular form. So many times.
@testacc613
@testacc613 2 жыл бұрын
Thanks it helped me install it
@aram5642
@aram5642 2 жыл бұрын
I knew and I had used it to make my form value adhere to a model, before typed form had been introduced. Offtopic: did you know about viewProviders?
@JoshuaMorony
@JoshuaMorony 2 жыл бұрын
I get the general idea but I've never used it - do you have situations where you like to use viewProviders?
@stevenjeanne4156
@stevenjeanne4156 2 жыл бұрын
@@JoshuaMorony I use viewprovider like that : viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }] if I don't want to use CVA
@TheJuicyTangerine
@TheJuicyTangerine 2 жыл бұрын
I'm so sad I watched this video this late, as I've had to learn all of this the hard way the first time
@JoshuaMorony
@JoshuaMorony 2 жыл бұрын
Learning it the hard way makes it stick better at least!
@additionaddict5524
@additionaddict5524 2 жыл бұрын
I think everyone stumbles awkwardly across this if they interact with angular forms.
@JoshuaMorony
@JoshuaMorony 2 жыл бұрын
I'm pretty sure the reason for coming across this more recently is that I was probably just getting away with more naughty stuff pre-typed forms
@Simon_IHG
@Simon_IHG 2 жыл бұрын
I'm still trying to figure out how to properly get the value from my form when I have on one side a FormGroup with a control that can undefined but is required and on the other side my service with no undefined attribute. Even with form.getRawValue() you get an error as a control could be undefined regardless of the "Required" validator. Do you know if there is a best practice regarding this ? For now, I call form.valid method then form.getRawValue() as XXX.
@adambickford8720
@adambickford8720 2 жыл бұрын
I enjoy angular but this one of the worst, most unintuitive apis i've ever seen in a ui toolkit.
@chupitolepame5357
@chupitolepame5357 2 жыл бұрын
getRawValue() is a great weapon to combat non straightforward obtainable values from any form! being using it since ever.
What I learned from this crazy RxJS stream in my Angular app
25:31
Joshua Morony
Рет қаралды 22 М.
요즘유행 찍는법
0:34
오마이비키 OMV
Рет қаралды 12 МЛН
Typed Forms in Angular
10:59
Angular
Рет қаралды 58 М.
First look at Signals in Angular
18:43
Decoded Frontend
Рет қаралды 46 М.
Angular Resource API - Everything You Have To Know (so far)
27:58
Decoded Frontend
Рет қаралды 18 М.
Enums considered harmful
9:23
Matt Pocock
Рет қаралды 215 М.
Why use OnPush in Angular? Not for performance...
13:16
Joshua Morony
Рет қаралды 32 М.
ngTemplateOutlet is WAY more useful than I realised
16:36
Joshua Morony
Рет қаралды 77 М.
I only ever use *these* RxJS operators to code reactively
25:25
Joshua Morony
Рет қаралды 136 М.
The easier way to code Angular apps
9:54
Joshua Morony
Рет қаралды 69 М.
My go to way to manage state in Angular applications
9:43
Joshua Morony
Рет қаралды 43 М.
Angular is about to get its most IMPORTANT change in a long time...
10:15