223 questions
2
votes
2
answers
66
views
Angular Reactive Form still includes empty values in form.value even after applying validators
I'm using a
Angular 20 with Reactive forms. Even after applying Validators.required to some controls, the form still includes empty string ("") or Null values when I log or submit form.
I ...
1
vote
1
answer
67
views
Angular FormBuilder with spread operator on object with arrays has FormControls of the wrong type
I'm using the Angular FormBuilder (import { FormBuilder } from '@angular/forms';) to create my FormGroup and inner FormControls as this right now:
formGroup = new FormBuilder().nonNullable.group({
....
- 9,364
1
vote
1
answer
242
views
How to integrate an Angular 16 application into an existing AngularJS (v1.x) application?
I am working on a project that currently uses AngularJS (v1.x). We want to slowly migrate some parts of it to Angular 16 without doing a complete rewrite at once. Specifically, I want to call a ...
- 4,469
1
vote
1
answer
54
views
How do I bind an Angular reactive form selectbox field to the attribute in the underlying component?
The values of my selectboxes in my reactive form are not binding to the component's formcontrol.
Here I have a date element that I expect to populate the deliveryDate field but the it is not populated:...
- 2,306
0
votes
1
answer
336
views
Angular Form: Run Function on Field Touch, Not Just on Value Changes
I'm working on a form in Angular, and I need to determine if every invalid field has also been touched. This is to provide visual feedback to the user. I currently have a function that checks for ...
- 449
0
votes
1
answer
113
views
My mat-form-field doesn't work unless it has a ngIf attribute even though it's redundant
I've been tasked to migrate a project that's using Angular v9 to Angular v17 and everything's been smooth so far without having to change much, but I've encountered a really weird bug and I can't find ...
- 748
0
votes
1
answer
140
views
How to dynamically add additional formControls via template outlet?
So, I have the issue that I have a base component that has a form. But I would like to be able to add another field to it. Why? Because I have four pages, with a very similar structure, that differ ...
- 1,263
0
votes
1
answer
416
views
Get current value of an Angular 17 FormBuilder field not reflecting actual value
I'm building a string of text in my template from multiple sources. Each of the fields fires it's own change event successfully, but I'm trying to get the value of the constraint field from within the ...
- 5,046
0
votes
1
answer
291
views
Showing items in Form Array
I need to show users' names and a list of their courses. Different users have different numbers of courses. Thus, I am trying Angular Form Array.
Here is my .ts:
this.form = this.fb.group({
name: [''...
- 621
-1
votes
2
answers
259
views
strike on subscribe while coding in angular. Its says depreciated on hover [duplicate]
I am still figuring out angular. I am working a form to post user details. The form is working and i can see the values in database. Problem is i see a strike on subscribe and on hover it shows the ...
0
votes
0
answers
45
views
Build Angular form with two formarrays nested inside each other
I am building Angular form with two formarrays nested inside each other.
I have an API enpoint that expects a JSON file whose structure is defined from three custom types.
Here are these three custom ...
0
votes
1
answer
373
views
Angular Type assertion doesn't happen for FormGroup when used as Input
I have multiple forms in different components. I am using formBuilder to create my formGroups for typed forms. When I am passing the created formGroups to a child component through @Input, I don't see ...
- 393
2
votes
1
answer
987
views
Angular updateValueAndValidity() doesn't work
I have simple form:
<form [formGroup]="form" (ngSubmit)="onSubmit()" novalidate>
<input type="radio" id="enabled" formControlName="enabled"
...
- 3,502
0
votes
1
answer
367
views
Angular Typed Forms & Validators | Case Example
Let's assume having a simple form like this:
return this.formBuilder.group({
myNumber: this.formBuilder.control<number | null>(
null,
Validators.required
)
});
The control ...
- 215
0
votes
1
answer
228
views
How to limit decimals displayed in angular FormControl?
I saw tons of custom code to manually modify the values or init values, but is there any native way in angular reactive forms to configure the way numbers are displayed in inputs?
Without modifying ...
- 4,188
0
votes
1
answer
239
views
Angular + ASP.NET WebApi register form issues using Form Builder
I try to create my first project but still facing many problems with Angular.
Currently I am busy with register form using Form Builder.
Firstly I paste my code:
register component:
export class ...
- 127
3
votes
1
answer
98
views
Form Array data replace when type 2nd row input fields in Angular
Output Image
I need to get the form data from this dynamic form. see my output image here I select 2 designation and 3 shifts from the multiselect. after I hit the save button the form was generated ...
- 31
0
votes
1
answer
557
views
Angular custom FormControl & AsyncValidator Submit not working on first click
I have somes Forms, that usese some custom FormControls, but when I place one of these FormControls last, it causes the Submit button to not work on first click (without prior leaving the last input ...
- 103
-1
votes
1
answer
469
views
Regex prevents values less than or equal to zero and accepts decimal values
Hello I'm building a form in Angular with FormBuilder and i want to put a validation in Validators.pattern() that prevents values less than or equal to zero and that accepts decimal values
How would ...
2
votes
0
answers
145
views
How to make a FormGroup optional(nullable) inside another FormGroup all strongly typed? (StackBlitz indside)
https://stackblitz.com/edit/angular-formgroup-optional?file=src%2Fmain.ts,src%2Fform%2Fform.component.ts
So i have a strongly type formgroup like so:
export interface BasicForm {
id: FormControl<...
- 1,107
1
vote
2
answers
997
views
Angular FormBuilder is undefined in unit tests
I have the following component:
.ts:
import {Component, Inject} from '@angular/core';
import {FormBuilder, Validators} from '@angular/forms';
import {MAT_DIALOG_DATA, MatDialogRef} from '@angular/...
- 18.2k
0
votes
1
answer
204
views
Angular 14 - How to break two way binding on formgroups inside formarray for mat-dialog?
My problem is detailed lower down. I have a mat-dialog that is used to edit a previous data entry. Each entry has a FormGroup in the form of a Deliverable. So a FormControl name, and a FormArray Steps....
- 133
0
votes
2
answers
2k
views
Why my FormControl displays [object Object]?
The form control has a default value coming from Component data which is displayed fine when disabled.
But when the field is enabled I get [object Object] in the input field.
It's almost the same to ...
- 4,188
1
vote
1
answer
893
views
Multiple values in form builder
Actually i'm only saving the value of "member.text", but i want save to "member.id", in "this.fb.group". It's possible save both values at same time?
I need value to ...
- 227
0
votes
1
answer
195
views
Angular Form not showing in browser
Hi I'm trying to create a form where you can update data choosen from a table. Everything works in my app, I can get all the data, create new or delete but the edit form is simply not showing in the ...
- 303
0
votes
2
answers
1k
views
Parent is not passing form values to CVA child form group
I have an Angular 15 application (see source code on Stackblitz) that uses reactive forms and a ControlValueAccessor pattern to create a parent form which includes child form groups. When I add a form ...
- 210
0
votes
1
answer
200
views
Angular 14/+ FormBuilder not accepting RawValue of object while creating its FormGroup
I've this custom type FormRawValue that returns the JSON/RawValue of any AbstractControl
import { AbstractControl } from '@angular/forms';
export type FormRawValue<T extends AbstractControl> = T ...
- 289
0
votes
1
answer
737
views
Dynamically compute value from multiple FormControl valueChanges with rxjs in Angular
I have an array of FormGroups which all holds one FormControl called checked which is represented as a checkbox input in the template.
This array formGroups$ is computed from another Observable called ...
- 167
0
votes
0
answers
305
views
How to access Angular formControlName of formGroup in formGroupName (nested FormGroup) to a control
Here's my Angular template:
<ng-container *ngIf="form.get('typeId').value == 3">
<div formGroupName="options">
<div *ngFor="let ctrl of ctrlOptions; ...
- 10.4k
0
votes
1
answer
459
views
Angular -How to get radio button values from user input form?
I'm trying to get values of three options from user input form: first one is select option, which is working, third one is timepicker which is working, and second one is radio button group of two ...
0
votes
1
answer
1k
views
How to get focused form control name in angular reactive forms with the help of ReactiveForms
One way i tried is adding OnFocus event on the form control.
Is there any possibility to get it with the help of reactiveFoms itself.
- 3
0
votes
1
answer
1k
views
Angular 14: Programmatically created component that has NgControl as a dependency
Trying to add a component to the DOM with ViewContainerRef createComponent. However, the component depends on NgControl. The end goal is to add components to a form using the FormBuilder.
Can't seem ...
0
votes
2
answers
888
views
Getting error while using Angular Form Array
Why am I getting this error, and how to get it fixed:
TS2740: Type 'AbstractControl<any, any>' is missing the following properties from type 'FormGroup': controls, registerControl, addControl, ...
- 275
0
votes
2
answers
4k
views
Angular using disable form control typed forms
I'm updating all my angular forms to typed forms. I define it like follows:
readonly personForm: FormGroup<{
name: FormControl<string>
favorites: FormControl<string[] | null>
}&...
- 1,277
1
vote
0
answers
117
views
How to validate formgroup at mat-stepper if array is empty or not
I am implementing mat-stepper in my code and stucked in a problem which I need your help.
On the second form group I have Array of Objects which I show only the data in that form.
But I want that if ...
- 895
0
votes
1
answer
197
views
how to save value of formarray in mysql with nodejs
I have a problem and I want someone to help me.
My English is not that good, I'm sorry about that I'll try my best to explain the problem to you hopefully u can help me and thank you.
I'm working ...
- 35
0
votes
1
answer
685
views
How to get the value of nested form with get in formbuilder?
I use form builder to build a form and using get to obtain the value of birthday, ageNum and ageUnit, but it seems that this method is not working cuz it may got null in group age.
does anyone know ...
- 1
0
votes
1
answer
2k
views
angular custom form control not calling onChange
I am building a simple custom form control that requests data and populates a mat-select.
I have followed the angular tutorial and also several others...
These are my 2 favorite
https://sreyaj.dev/...
- 1,889
0
votes
1
answer
1k
views
Angular Typed Forms: How to correctly type and create dynamic fields?
I have the following formgroup:
this.formBuilder.group<{
id: number;
nameDe?: FormControl<string>;
nameFr?: FormControl<string>;
nameIt?: FormControl<string>;
}>...
- 8,886
1
vote
1
answer
1k
views
Can't bind to 'formGroup' since it isn't a known property of 'form'. Error occurs in the template of component AppComponent
I have the following error in the latest version of Angular:
Can't bind to 'formGroup' since it isn't a known property of 'form'.
Error occurs in the template of component AppComponent.
app.component....
0
votes
1
answer
688
views
How to give the value of an array element for a value in the formbuilder group?
I want to populate the dropdown in angular reactive form through the data obtained from endpoint. It is created as a FormArray as follows. userDetailsData is the data object which is store the data ...
- 94
2
votes
2
answers
4k
views
Angular Reactive Forms - Enabled/Disabled Form Control not correctly reflected on UI after FormGroup is Re-initialized
I have a test angular reactive form, where you can enable/disable a Form Control, and apply required/optional validation.
I am running into an issue where the FormControl enabled/disabled state is not ...
- 69
4
votes
0
answers
1k
views
Adding/Removing formControls removes errors on another fields in angular reactive forms
I have an issue regarding adding and removing form controls in angular reactive forms.
consilder the following form,
objBasicInformationForm :any = this.objFormBuilder.group({
.
.
.
...
- 129
0
votes
1
answer
777
views
input from a scan to a form builder in angular
I need to fill in a field of a form builder using the zxing-js library, I am able to read the qrcode and insert this data into the input, but when submitting the field it is blank, if the insertion is ...
0
votes
0
answers
490
views
Separate Dropdown for Day, Month and Year in Angular8
I need help to create custom Date Picker like the below image.
I am trying to do using formGroup But I am not much experience in angular.
<form [formGroup]="profileForm" (ngSubmit)="...
1
vote
1
answer
517
views
How to push the array items to the array properties of form group
I have a form group defined as:
this.scheduleParentModel = this.fb.group({
startDate: ['', dateValidator()],
endDate: ['', dateValidator()],
frequency: [1, Validators.required],
...
- 2,529
0
votes
0
answers
487
views
ControlValueAccessor I am using deeply nested Custom Component, How to pass value from last Child-3 to the parent Component
I tried to mimic the folder structure as similar to my application.
Shared a stackBlitz link
https://stackblitz.com/edit/angular-ivy-61duhd?file=src/app/child-1/child-1.component.html
Expected:
When ...
- 73
0
votes
1
answer
1k
views
Cannot read properties of null (reading 'controls') in Nested Form of Angular Form
I'm new to angular. Working on creating nested form in angular where I'm facing difficulties for getting controls of some fields based on the JSON structure shown below where I'm facing difficulties ...
- 75
0
votes
2
answers
6k
views
Angular Reactive form setValue setting string to number input type, input box empty but string value is assigned in controlls
Angular Reactive form setValue setting string to number input type, input box empty but string value is assigned in controlls, validation required is not working
This is Form Controller
ngOnInit() ...
- 45
1
vote
2
answers
2k
views
How to check if matInput displayed an error
I try to display an error message and error icon when matInput has an error (controlled by a formControl).
But if the form is submited without touch the field, error is not displayed.
View code ...
- 3,007