Forms In angular2

by

I’m guessing that by ngModal you mean ngModel.

“1-which form is best template or modal driven and why ?”

from: http://blog.ng-book.com/the-ultimate-guide-to-forms-in-angular-2/

To create a new ControlGroup and Controls implicitly use:

ngForm and ngControl

To bind to an existing ControlGroup and Controls use:

ngFormModel and ngFormControl

Basically one is more convenient but gives you less control, personally I try to use template driven first because its more simple and less code, until it is not enough then I switch to model driven.

2- When to use ngControl and when to use ngModel ?

I don’t know if you are mixing concepts here but ngControl and ngModel are not precisely meant to replace each other, ngModel handles the sync between input components and your domain/presentation model while ngControl handles the state of the form based on Validators, dirtiness of the input, etc, more geared towards giving feedback and allowing/stopping the user from submitting an unvalid form.

The ones that could replace each other are the one I mentioned previously in answer 1.

I hope that helps clarify a little bit?

As for the values of checkbox and radios, you only have ngFormControl’s on them, add ngModel to map their values into your model. Once again quoting from the same page:

<input type="text" id="productNameInput" placeholder="Product Name" [ngFormControl]="myForm.find('productName')" [(ngModel)]="productName">

You can see that he is using both the ngFormControl and the ngModel.

More Related Contents:

  1. Can’t bind to ‘formGroup’ since it isn’t a known property of ‘form’
  2. Angular2 nested template driven form
  3. Angular how to get the multiple checkbox values?
  4. password and confirm password field validation angular2 reactive forms
  5. angular2 manually firing click event on particular element
  6. Apply a directive conditionally
  7. When to use FormGroup vs. FormArray?
  8. two way binding with safe navigation operator
  9. What are the practical differences between template-driven and reactive forms?
  10. Property ‘controls’ does not exist on type ‘AbstractControl’ Angular 4 [duplicate]
  11. Angular 2 Form “Cannot find control with path”
  12. Angular2 – Validate and submit form from outside
  13. Angular 2 – formControlName inside component
  14. Resetting a form in Angular 2 after submit
  15. Generic email validator
  16. formGroup expects a FormGroup instance
  17. Is it possible to get native element for formControl?
  18. ng-content select bound variable
  19. The pipe ‘ ‘ could not be found angular2 custom pipe
  20. Angular2: validation for won’t trigger when changing the file to upload
  21. What is the difference between formControlName and FormControl?
  22. How to reset form validation on submission of the form in ANGULAR 2
  23. TypeScript-‘s Angular Framework Error – “There is no directive with exportAs set to ngForm”
  24. ngModel cannot be used to register form controls with a parent formGroup directive
  25. How to clear form after submit in Angular 2?
  26. Angular 2 Reactive Forms trigger validation on submit
  27. Angular 2 creating reactive forms with nested components
  28. Angular 2 FormGroup Add Validators dynamic
  29. Angular2 Error: There is no directive with “exportAs” set to “ngForm”
  30. Property ‘value’ does not exist on type ‘EventTarget’

Leave a Comment