Template Driven Forms in Angular

[@ZenOfTube]

There are a couple of comments about this, but right around 15:25 it is necessary to remove the parameter "form: NgForm" from your onSubmit() method because we are no longer passing anything to it from our template. Sandeep you may want to edit in a quick note in the video to help avoid confusion.

[@StudyMash]

Thanks for reminding me this, I will look at this and add it, for now I am pining your comment so that it will always be on the top of this video. Thaks again for your valuable feedback.

[@CarlosRibeiroRC]

At 18:30 for angular 15: Please provide name Name must be at least 5 characters long

[@HritikKumar-h3n]

thanks aloot

[@olenakhomeniuk7039]

This is just the best tutorial for Angular ! God bless you!

[@midhunmohan5112]

Nice tutorials.. clear and crisp!

[@banavalikar]

At 15:26, the Form: NgForm argument has to be removed from the onSubmit method for the code at 15:30 to work. Is this correct?

[@StudyMash]

Yes, you are correct, it will give compile time error if you will not remove it.

[@ZenOfTube]

In Visual Studio Code I get errors on my ngForm and ngModel at first, but a restart of the IDE makes them go away for a while. the code works and compiles but this seems to be an bug with VS Code.

[@sampleee]

When will we begin doing the back end code with C#?

[@StudyMash]

First we will setup all models and screens and save all data in browser local storage. Then we will start creating database API.

[@pattywilliams7314]

@@StudyMash Do you know when you will have those videos uploaded?

[@devenshah3653]

at 15:30 when you remove Form variable from onSubmit() method, I get this error ERROR in src/app/property/addProperty/addProperty.component.html:8:27 - error TS2554: Expected 1 arguments, but got 0. 8 ~~~~~~~~ src/app/property/addProperty/addProperty.component.ts:8:16 8 templateUrl: './addProperty.component.html', ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error occurs in the template of component AddPropertyComponent. But if keep it, error goes away.

[@StudyMash]

You will have to remove form parameter from onSubmit method in component as well to get this work.

[@VipinKumar-pl2nr]

@@StudyMash not working when I try to remove form from onsubmit()

[@vipinsingh-ce3bu]

ERROR TypeError: Cannot read properties of undefined (reading 'tabs') any one have this issue?

[@kasperkat2004]

I like this form!

[@MBDiscover]

Hi dear Mash, i'm getting this error although imported FormsModule and ReactiveFormsModule: No directive found with exportAs 'ngForm'.

[@StudyMash]

Can you share the github link to your code?

[@jameshemen9740]

Hello everyone. I am having this error and am stocked for days. I did exactly what he did and I still have the error. Property 'addPropertyForm' has no initializer and is not definitely assigned in the constructor. @ViewChild('Form') addPropertyForm: NgForm; in my add-property.component.ts, Please help am stocked

[@shankarghimire4492]

Hi James, I guess it is already so late to response, but still, I solved it by using '!' sign. I think, it is new rules required in the Angular 12 to declare a variable without initializing any value. @ViewChild('Form') addPropertyForm !: NgForm; Just put '!' sign in front of the ':' sign. Hopefully it might help to others as well who might get the same issue and get stuck in coming days! Cheers!

[@jameshemen9740]

Kindly help Sir, I am using angular 12 Error: add-property/add-property.component.ts:11:22 - error TS2564: Property 'addPropertyForm' has no initializer and is not definitely assigned in the constructor. 11 @ViewChild('Form') addPropertyForm: NgForm; ~~~~~~~~~~~~~~~

[@StudyMash]

Can you give me the github link to your code

[@murthyvvn27]

use ! mark after addPropertyForm .. @ViewChild('Form') addPropertyForm!: NgForm;

[@ingcheh69]

my ngSubmit doesn't work, but when change to (submit), it works

[@satishtirmulagiri9760]

Hi There, There is any way I can copy this code ?

[@StudyMash]

Below is the link to code repository github.com/webtrainer-in/HSPA

[@shivamrathore8515]

propName.errors.required, propName.errors.minlength not working

[@shivamrathore8515]

Please provide name Name must be atleast 5 characters long Got the solution

[@darahmed2355]

@@shivamrathore8515 Thanks.. @Shivam Rathore

[@vivek1692asd]

propName.errors.required, propName.errors.minlength not working , getting Object is possibly 'null'.

[@RajendraSingh-ik2ny]

use "?" for handle null value like *ngIf="propName.errors?.required"

[@TOPTECHY8]

@@RajendraSingh-ik2ny thank u

[@ninadylan4649]

Hi I have the same error

[@ninadylan4649]

@@RajendraSingh-ik2ny this didn't help...is there any other way?

[@TOPTECHY8]

@@ninadylan4649 *ngIf="propName.errors?.['minlength']" this will help

[@javiermanzanillo]

hello! what happend with the asp.net core?

[@StudyMash]

Will start after few more videos

[@خالدحسن-ز5ف]

thank you sir , 15 and 16 are the same.

[@StudyMash]

Thanks for letting me know, I have removed one

[@abdurmuneer2969]

Please help me sir i am stuck in that.

[@vivekgajjar1469]

thanx sir, one of the my requests is that if you create a WhatsApp group and put the link in your channel description , you will be able to help much more and you will be very much inspired

[@balajeek]

I know you stay away from jquery, I beleive you use bootstrap doesn't it install jquery by default! I notice you use ngx-bootstrap which is great and I try to add that to my project.

[@StudyMash]

No, bootstrap doesn't install Jquery by default and I use only css part of bootstrap.

[@balajeek]

got it thanks.

[@itsolutions8431]

show images instead of field add property component

[@StudyMash]

It is already there in later videos

[@prabhgill4060]

My form is always valid even if no values are added,

[@noorulaarefinsyed4393]

you need to add required attribute in all your input fields for ex :- , this will make it Invalid if the required fields don't have data entered.

[@abedja100]

Hello everyone if you have an errors with (propName.errors.required) try this span Please provide the name and the same in minlength Thanks