Building Forms in Angular Apps | Mosh

[@sahil-bawa]

As a newbie to Angular, I tried watching multiple videos on Reactive vs Template-driven forms. This was the only video whose explanation and use of graphics finally made it click in my head. Thank you Mosh! Don't know why I even bothered looking elsewhere for learning Angular Forms.

[@rjconnolly]

You are my hero - coming from an HTML PHP environment this is helping me out so much!!! THANK YOU!

[@sanmani7781]

Thank you Brother. This video helped me to learn the angular form very easily. God Bless You.

[@ananthuvenugopal9655]

This is one of the finest tutorial about forms in angular. Explained everything crystal clear. Thank you so much 🙏

[@bubamanjang]

Your efforts in making these amazing videos is highly appreciated. Thank you so much!

[@m.m.farhad5292]

Can not thank you enough Mosh, lifesaver.

[@Vedase26]

I must share my feedback about this video. Content is very easily understandable. I tried many other videos to understand how these formCcntrol and formGroup works. I failed many times to ans properly in interview. But this video made concept clear to me. Thanks a lot.

[@someshnukala804]

One of the greatest Technical Teachers in the world. Mosh sir! Thank you so much sir. Hats off

[@NourLababidi]

Thank you very much. The speed is perfect and the instructions are clear . One of the best. Thank you!

[@dominiccampese2159]

This is exactly the explanation I was looking for great content

[@manjunathrajure2257]

This helped a lot to understand angular forms in simpler way.

[@hussain5755]

I can never thank you enough you have restored my faith in humanity Love you man. Please keep making these awesome videos with the amazing explanation of theory and the code along solutions thanks again

[@mark_1_1_1_1]

You are amazing teacher, Mosh! 🏆

[@williamsbron2686]

that was great Mosh it helps me a lot really really really really thank you Mosh😍😍😍😍😍

[@sample1801]

Thank you mosh ! This video explained me easier !

[@soundariyab206]

Amazing and very helpful video, as I am a beginner in angular so this video is very helpful to clear basic things related to angular form and controls. Thank you Mosh for this video and please try to make some more videos on angular basics especially for beginners.

[@rjbirelly1]

Thank you Mosh. Your videos are amazing and very easy to understand the concepts.

[@jasminem360]

you are really good at explaining ! help me a lot!

[@jamaluddinmondal9276]

Thanks for giving a clean explanation ,👌 You may use Prettier extension on Vs Code automatically every property will be shown line by line

[@danishchief1078]

From anyone who gets an error "There is no directive with "exportAs" set to "ngModel"" you should: import { FormsModule, ReactiveFormsModule } from "@angular/forms"; @NgModule({ imports: [ BrowserModule, FormsModule, //

[@saivaruntangalla2279]

Do we need it import it in component.ts file

[@bilalnizamani7447]

I have the same problem.

[@SapreShreyas]

thanks man! add this in app.module.ts

[@TheDruzzila]

i love your face so much and i dont know even how you look like

[@hafsadolly6830]

Where we should do this?

[@1000lino]

Clear and concises explainations make the subjet so much easier to understand Thank you so much!

[@ScienceSeekho]

Your the best please upload all courses on udemy I am ready to pay

[@yogeshcaptain]

that's wonderful and so easy to understand. Thanks a lot Mosh :)

[@premiuminstituteofexcellen9035]

For Angular 13 use this statement First Name Required

[@anandbmuley]

I like the part and the thought process behind code formatting. You should always treat the code as an art too and not only science👍

[@grazielesilva5306]

Thank you for share some knowledge and spend some time doing that kind of content for the community! Bless you.

[@farhangmdc]

Great Explanation 😇

[@julioblancas706]

Thank you for sharing your time and knowledge with the people loves learn. Congratulations!.

[@breakingcode92]

Thanks so much for making this video.. Honestly it was such a good help. I'll link you when I'm done with the site I'm working on :D

[@nashrampy]

Thank You Mosh!

[@MrTryten]

The besting about your teaching is that you advise on the use case scenarios…. That is a great way to learn…. Thanks

[@charliemccharlie]

In the most recent versions of Angular you might get errors that one of these validation properties might be null. In such a case, you can use a safe navigation operator such as this: *ngIf="firstName.errors?.['required']"

[@bigsmall99]

Excellent instruction.

[@irohits3314]

Its a great help..Thanks

[@romankostiuk]

Good lesson for beginers... thanks!

[@mathieufabre7194]

really good video, good sound, good voice, and goos explanations. a f****ing good work !

[@soultouchingsongs]

You are the best👍. It helped me a lot.. Thank u..

[@journeyofadigitalartist5021]

you made this easy to understand, I will still watch it again , though

[@objectObject212]

Great tutorial, thanks.

[@maximrunix]

sos un groso , gracias , me salvaste la vida

[@ledspbr]

Puts... Este cara é muito bom This guy is greeeat teacher

[@priyeshprince2318]

Thanks Mr tutor

[@ASouza-ut9kb]

Much better then oficial site!

[@noname-bh1os]

Well explained. thanks a lot Mosh!!

[@Shiva-zy7jq]

Thank you Mosh for the video.

[@bilelmaaloul7850]

thanks for the effort

[@mahilkr]

Very nice, great presentation.

[@asifaasi918]

tnQ Mr.Mosh

[@khizer3528]

Excellent 🔥🔥 Thank you for this tutorial .

[@bmulamba6685]

this is awersome thank you

[@aoam9194]

I like your videos. Thanks alot mosh 😃

[@tejpalsingh294]

حسبي الله لا اله الا هو الحي القيوم ggghhtt ho ki hi

[@aoam9194]

Tejpal Singh 😒 I don't understand this language

[@7Rainbows]

Thank you so much Mosh

[@abderazzakmnaimoutaanni1763]

Hello, Thanks for the awesome video, I just want to add that on Angular10, the firstName.errors object can be NULL, so you need to use the safe navigation operator ? *ngIf="firstName.errors?.required" regards

[@aviralgoel2841]

And now in 2022 use *ngIf="firstName.errors?.['required']"

[@ericwilfriedettien4603]

Thank you very much !

[@nareshgoud1905]

Great video Mr.Mosh. thank you very much

[@alyaaabou_elhamd1331]

thank you so much .. i need a reactive form video please

[@jagadeeshkalugotla]

Actually i was struggled a lot for form validating but trust me this is the one of the best tutorial ----->Jagadeesh

[@santoshsingh6404]

Many Thanks for such an awesome videos. Thanks a Ton Sir!!!!

[@davooddehghan65]

Thank You man great tutorial it's an amazing work!

[@skilljourney6357]

r u great teacher.

[@SushilSharma-po6ur]

Such a nice video helping to easily create an angular form

[@raghubsrinivas6025]

Thank you for this Information.

[@faisalmushtaq6008]

An excellent tutorial indedd

[@ErayTonyali]

Thanks for your amazing tutorial!

[@sharathkp2310]

nice class

[@elenegulordava1868]

Thank for your detailed, great explanations, it's an amazing work!

[@ale_lunalili]

Great video, thanks.

[@ramuk9570]

use full of the beginners

[@slays6916]

awesome job man!

[@agustinbcu]

Great video, but the way awesome t-shirt.

[@tonynguyendtn1984]

would you ever consider updating your courses for Angular 7?

[@rickys3481]

This is the best

[@weezySKLH]

Dude you are the best

[@cvchanel4763]

Thank you verry much :)

[@purshotham91]

Seriously your tutorial was very helpful for me. But you didn't mention about submit button validation. Can you help me with that?

[@RandomNiceThings12]

great video

[@arjunsunny999]

Yoy are great.. ty,,,,,,,Where d o i get this code????

[@neko_senpaianimeamvedits9598]

Nice ❤

[@hassanaguezoum3477]

Thank you ❤

[@danielaregawi]

Thank you so for sharing this video!! What's the editor you we're working on?? I love how it simply generates the markup can you please share how I can use it too?

[@jamaluddinmondal9276]

Vs Code Editor by Microsoft

[@rahulmathew8713]

U can do mvvm in angular you dont need reactive form and other crap. You decide your architecture the framework should not decide for you. And unlike react , you don't need to write html inside javascript. So there is clear separation of concern. View is not responsible for checking business logic , its business model job to do that and let the view know about how to present the data via viewmodel. Just create a viemodel and bind that to the view. Do data transformation logic and data validation inside a business model. Inject the business model to view model via the constructor. inject the dataservice api layer to model via constructor. If you need to call component B from component A, just expose an interface and let A create a viewmodel by inheriting from that interface and pass an instance of that viewmodel as a property binding to B. Thats it. Angular clearly simplifies the architecture and lets your write decoupled manageable application. Period.

[@SushilSharma-po6ur]

Thanks a lot Mosh

[@benjaminperez6777]

exelente video

[@adityachoudhari2182]

people watching this video now , use prettier or beautify extensions , for clean templates instead of hardcoding lines.

[@cachkiemtienonlinetainha]

Thank you so much

[@amahrizal]

Many thanks

[@علياءاسامه-ت4م]

thanks a lot .It is awesome

[@AdityaKumar-cy2cr]

Thank you

[@alaamoustafa7991]

you are perfect !

[@akfsf00543]

Angualr 17:- Time10:28 #firstName="ngModel" error NG8003: No directive found with exportAs 'ngModel'. [plugin angular-compiler]

[@leratomphahlele1908]

in the beginning of the video you said you will show us how to make submit button active when all fields are valid???

[@guyr989]

Great video! But how do you clean all the alerts after you 'unFoucused'? and how to add a confirm submission massage?

[@yt1234567100]

thanks.. good jobs

[@OPSergio88]

damn..., your content is great! i would love to know more english so i can understand you better :P

[@MrAmrmnabil]

Thanks

[@SzigSag]

Hy there,... i was wondering why im getting the ERROR TypeError: Cannot read property 'required' of null! Been already on stackoverflow and the angular docs but no solution could help me get rid of that problem! You guys have any solutions for me? ;) btw... visual studio gives me that error message aswell: Identifier 'required' is not defined. '__type' does not contain such a member

[@prayagparikh8020]

It's showing same error for me. What's the solution?

[@jainshilpi3]

I am getting this error There is no directive with "exportAs" set to "ngModel" ("ass="form-group"> Name: ]#firstName="ngModel" (change)="log(firstName)" type="text" class="form-control" id="firstName"/>

[@joaovitorfernandes8201]

stackoverflow.com/questions/38648407/angular2-error-there-is-no-directive-with-exportas-set-to-ngform

[@bishoywagih9663]

you have to add the validation rule in input filed.. so change the input field from ]#firstName="ngModel" (change)="log(firstName)" type="text" class="form-control" id="firstName"/> to ]#firstName="ngModel" (change)="log(firstName)" type="text" class="form-control" id="firstName"/>

[@amaanimtiyaz]

For those whom are looking for the same: 1.Go to app.module.ts 2.Paste - import {FormsModule} from '@angular/forms' ; 3. In "Imports" section down there: write FormModule eg: imports: [ BrowserModule, FormsModule ]

[@petarjovanovic8524]

Did you solve that problem ,cuz I got the same ? Thanks!

[@ezzabuzaid]

You're great

[@SureshBabu-pz5ks]

HI Mosh, Iam getting the Error: No value accessor for form control with name: 'firstName' plz let me know how to fix

[@manishankar8688]

i cannot see metadata of ngmodel drictive in the development tool. what is need to done to see metadata example details of ng_module.