An Angular form is a collection of data input controls. Use this tag for questions pertaining to template-driven and reactive forms including NgForm, FormGroup, FormControl, AbstractControl, FormBuilder, and Validators as well as data binding between forms and components.
Questions tagged [angular2-forms]
2651 questions
1299
votes
48 answers
Can't bind to 'formGroup' since it isn't a known property of 'form'
The situation
I am trying to make what should be a very simple form in my Angular application, but no matter what, it never works.
The Angular version
Angular 2.0.0 RC5
The error
Can't bind to 'formGroup' since it isn't a known property of…

FrancescoMussi
- 20,760
- 39
- 126
- 178
330
votes
9 answers
How can I manually set an Angular form field as invalid?
I am working on a login form and if the user enters invalid credentials we want to mark both the email and password fields as invalid and display a message that says the login failed. How do I go about setting these fields to be invalid from an…

efarley
- 8,371
- 12
- 42
- 65
291
votes
27 answers
TypeScript-'s Angular Framework Error - "There is no directive with exportAs set to ngForm"
I keep getting this error while using TypeScript's Angular2-forms framework:
There is no directive with "exportAs" set to "ngForm"
Here's my code
project dependencies :
"dependencies": {
"@angular/common": "2.0.0-rc.6",
…

Nassim MOUALEK
- 4,702
- 4
- 25
- 44
289
votes
6 answers
tslint / codelyzer / ng lint error: "for (... in ...) statements must be filtered with an if statement"
Lint error message:
src/app/detail/edit/edit.component.ts[111, 5]: for (... in ...)
statements must be filtered with an if statement
Code snippet (It is a working code. It is also available at angular.io form validation section):
for (const…

Jek
- 5,546
- 9
- 37
- 67
209
votes
6 answers
What are the practical differences between template-driven and reactive forms?
I have been reading about Angular2 new Forms API and it seems that there are two approaches on forms, one is Template driven forms other is reactive or model-driven forms.
I would like to know the practical difference between the two, not the…

gdyrrahitis
- 5,598
- 3
- 23
- 37
187
votes
5 answers
Angular 2 disabled controls do not get included in the form.value
I have noticed that if I disable a control on an Angular 2 reactive form then the control does not get included in the form.value. For example, if I define my form like below:
this.notelinkingForm = new FormGroup({
Enabled: new…

Jim Culverwell
- 2,623
- 6
- 25
- 28
187
votes
14 answers
Angular 2: Can't bind to 'ngModel' since it isn't a known property of 'input'
I'm trying to implement Dynamic Forms in Angular 2. I've added additional functionalities like Delete and Cancel to the dynamic forms.
I've followed this documentation: https://angular.io/docs/ts/latest/cookbook/dynamic-form.html
I've made some…

Varun
- 3,695
- 6
- 21
- 34
158
votes
17 answers
Apply a directive conditionally
I am using Material 2 to add md-raised-button. I want to apply this directive only if certain condition becomes true.
For example:
Another example:
I created a basic dynamic reactive form in plunker.
I am…

user2899728
- 2,099
- 4
- 16
- 28
151
votes
5 answers
What is the difference between formControlName and FormControl?
I'm using ReactiveFormsModule of Angular2 to create a component that contains a form. Here is my code:
foo.component.ts:
constructor(fb: FormBuilder) {
this.myForm = fb.group({
'fullname': ['', Validators.required],
'gender': []
…

smartmouse
- 13,912
- 34
- 100
- 166
148
votes
17 answers
Angular ReactiveForms: Producing an array of checkbox values?
Given a list of checkboxes bound to the same formControlName, how can I produce an array of checkbox values bound to the formControl, rather than simply true/false?
Example:
142
votes
18 answers
Remove all items from a FormArray in Angular
I have a form array inside a FormBuilder and I am dynamically changing forms, i.e. on click load data from application 1 etc.
The issue I am having is that all the data loads in but the data in the FormArray stays and just concats the old items with…

Karl O'Connor
- 1,455
- 2
- 10
- 9
140
votes
11 answers
The pipe ' ' could not be found angular2 custom pipe
I can't seem to fix this error. I have a search bar and an ngFor. I am trying to filter the array using a custom pipe like this:
import { Pipe, PipeTransform } from '@angular/core';
import { User } from '../user/user';
@Pipe({
name:…

Sumama Waheed
- 3,579
- 3
- 18
- 32
135
votes
21 answers
Reactive Forms - mark fields as touched
I am having trouble finding out how to mark all form's fields as touched.
The main problem is that if I do not touch fields and try to submit form - validation error in not shown up. I have placeholder for that piece of code in my controller.
My…

Giedrius Kiršys
- 5,154
- 2
- 20
- 28
132
votes
7 answers
Property 'controls' does not exist on type 'AbstractControl' Angular 4
I am trying a nested reactive form in Angular 4. It is working fine but when I try to build AOT it's throwing the error
'controls' does not exist on type 'AbstractControl'
I googled and tried few things but no luck. Could anyone tell me how to…

Munna Babu
- 5,496
- 6
- 29
- 44
129
votes
7 answers
Angular2 set value for formGroup
So I have a complex form for creating an entity and I want to use it for editing as well I am using new angular forms API. I structured the form exactly as the data I retrieve from the database so I want to set the value of the whole form to the…

Amgad Serry
- 1,595
- 2
- 12
- 20