Questions tagged [angular-forms]

Questions related to Angular template or reactive forms.

has two built-in form modules with different approaches:

  • template-based, which uses [(ng-model)] syntax familiar to AngularJS developers, and allow form configuration within templates
  • reactive (or model-driven), which are assuming form model is managed entirely in javascript, often with help of

Both approaches allow validation.

The code and issue tracker are on github.

1989 questions
544
votes
11 answers

Can't bind to 'formControl' since it isn't a known property of 'input' - Angular2 Material Autocomplete issue

I am trying to use Angular Material Autocomplete component in my Angular 2 project. I added the following to my template.
Lahiru Chandima
  • 22,324
  • 22
  • 103
  • 179
395
votes
21 answers

Angular error: "Can't bind to 'ngModel' since it isn't a known property of 'input'"

I'm using Angular 4 and I am getting an error in the console: Can't bind to 'ngModel' since it isn't a known property of 'input' How can I resolve this?
Vijay Kumar
  • 4,059
  • 3
  • 11
  • 6
284
votes
15 answers

Angular2 If ngModel is used within a form tag, either the name attribute must be set or the form

I am getting this error from Angular 2 core.umd.js:5995 EXCEPTION: Uncaught (in promise): Error: Error in app/model_exposure_currencies/model_exposure_currencies.component.html:57:18 caused by: If ngModel is used within a form tag, either the…
Tampa
  • 75,446
  • 119
  • 278
  • 425
207
votes
11 answers

Expected validator to return Promise or Observable

I'm trying to do a custom validation on Angular 5 but I'm facing the following error Expected validator to return Promise or Observable I just want to return an error to the form if the value doesn't match the required, here's my code: This is the…
202
votes
15 answers

Set focus on element

I am working a front-end application with Angular 5, and I need to have a search box hidden, but on click of a button, the search box should be displayed and focused. I have tried a few ways found on StackOverflow with directive or so, but can't…
Bob
  • 2,043
  • 2
  • 9
  • 5
109
votes
13 answers

Confirm password validation in Angular 6

I want to perform password and confirm password validations using material components only,and an error message below the confirm password field if confirm password field doesn't match And if it is empty.Tried many resources unable to…
Shankar
  • 2,565
  • 8
  • 29
  • 56
105
votes
11 answers

Angular 2: Form submission canceled because the form is not connected

I have a modal that contains a form, when the modal is destroyed I get the following error in the console: Form submission canceled because the form is not connected The modal is added to a element which is a direct child to…
nick
  • 3,521
  • 3
  • 22
  • 32
95
votes
8 answers

Angular - Dynamically add/remove validators

I have a FormGroup defined like below: this.businessFormGroup: this.fb.group({ 'businessType': ['', Validators.required], 'description': ['', Validators.compose([Validators.required, Validators.maxLength(200)])], 'income': [''] }) Now…
A J Qarshi
  • 2,772
  • 6
  • 37
  • 53
85
votes
6 answers

Dividing a form into multiple components with validation

I want to create a single big form with angular 2. But I want to create this form with multiple components as the following example shows. App component
Lasitha Yapa
  • 4,309
  • 8
  • 38
  • 57
76
votes
5 answers

Get access to FormControl from the custom form component in Angular

I have a custom form control component in my Angular application, which implements ControlValueAccessor interface. However, I want to access the FormControl instance, associated with my component. I'm using reactive forms with FormBuilder and…
Slava Fomin II
  • 26,865
  • 29
  • 124
  • 202
74
votes
11 answers

Cannot find control with name: formControlName in angular reactive form

I found this problem in many questions in stackoverflow but no luck. Please help me for figuring out what I am doing wrong. In component : ngOnInit() { this.companyCreatForm = this._formBuilder.group({ name: [null, [Validators.required,…
Amir
  • 8,821
  • 7
  • 44
  • 48
66
votes
5 answers

Differences between value and ngValue in Angular 5

Today I realized about an unexpected (for me) behaviour of the reactive forms in Angular 5. The server was receiving from the app an string with the value "null" instead of the null value, whichh is what I wanted. I did the following…
Fel
  • 4,428
  • 9
  • 43
  • 94
55
votes
6 answers

How to add buttons without submit the form in Angular?

In Angular, how I add button without submit the form? for example I want to call onCancel without submit the form, but update button should be submit the form, and still keep the ngSubmit.

Jon Sud
  • 10,211
  • 17
  • 76
  • 174
51
votes
13 answers

Disable Angular 5 Input fields correct way

I have a FormGroup that was created like that: form: FormGroup; constructor(private _formBuilder: FormBuilder) { } this.form = this._formBuilder.group({ name: ['', Validators.required], email: ['', Validators.required,…
João Ghignatti
  • 2,281
  • 1
  • 13
  • 25
50
votes
8 answers

No provider for ControlContainer - Angular 5

I am converting a purchased, third-party template into an Angular 5 app, and just ran into an error. I am very new to Angular 5 (I know AngularJS well however) and don't understand what it's trying to tell me? It seems to be related to a button…
Todd Davis
  • 5,855
  • 10
  • 53
  • 89
1
2 3
99 100