4,843
questions
0
votes
1
answer
42
views
0.0 is getting converted to 0 in reactive forms
Using formcontrol we have a field with type=number (can't remove it)
<input #num type="number" formControlName="number" />
If user enter's 0.0, reactive form is reading it ...
0
votes
1
answer
28
views
Strongly Typed Reactive Form: Correct usage?
I am currently experimenting with Strongly Typed Reactive Forms in Angular.
I have defined an interface:
interface Data {
name: string;
mobile: number;
isAdmin: boolean;
}`
And here is my ...
0
votes
0
answers
14
views
custom form field ERROR TypeError: Cannot read properties of null (reading 'writeValue') at setUpControl
I developed a custom componet as form field, for doing so I implemented a directive following this article on mediumenter link description here,
this is the directive:
import { Directive, forwardRef, ...
1
vote
1
answer
98
views
Angular 18 Reactive form ERROR : There is no FormControl instance attached to form control element with name: 'q1124'
I have an angular component that will create and render a form dynamically using ReactiveFormsModule.
When I press submit it will post the data and I will get new questions for the component to render ...
0
votes
0
answers
30
views
How to disable nested form field using RxWeb reactive form validator
I need help for applying disable validator on nested form.
Please check this stackblitz link
I want to disable "address" control. But it's not working. Even the console is also not printing.
...
1
vote
1
answer
38
views
Getting error while accessing controls property of FormArray in Angular reactive form inside template.html
As new to Angular(14) I am facing this issue in reactive form while trying to access the controls property of formArray in the template file although I can access other properties like value in the ...
1
vote
1
answer
37
views
Jasmine test: Expected spy updateValueAndValidity to have been called
I have an Angular component with this method:
deleteRule(index: number): void {
this.rules = this.formGroup.get('rules') as FormArray;
if (this.rules.length > 1) {
this.rules....
0
votes
1
answer
111
views
Angular 17 Reactive Form: Radio Buttons Always Checked on Load Despite Boolean Values
I'm working on an Angular component that uses reactive forms with radio buttons. I want to create three radio buttons representing a boolean choice (true or false). The radio buttons are initialized ...
1
vote
2
answers
34
views
Issue with Patching Object Value to Angular FormControl in ngAfterViewInit
I'm working on an Angular form where I need to patch an object to a FormControl in ngAfterViewInit. However, I'm encountering an issue when trying to patch an object. Here's a simplified version of my ...
1
vote
1
answer
25
views
How to push collection of formgroup into formArray
I have a form in a steper (cdk) that works fine and I'm refactoring it to make it dynamic. My goal is to use json at the end to generate the form content.
Right now I have the following code:
export ...
1
vote
1
answer
44
views
Angular Dynamically Add Form Controls to Form
My goal is to be able to add a search form with any number of filters on a given page. For example, on my HomePageComponent, I would like to be able to do:
<app-search-form>
<app-searchbox&...
1
vote
1
answer
32
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:...
1
vote
1
answer
116
views
How to effectively use Angular signals inputs/effects with reactive forms
In the Angular documentation, I see this:
State changes are state changes of the component internal state or state changes by signals?
I'm having trouble by setting forms values with Angular using ...
1
vote
1
answer
33
views
Angular Reactive Form - Get 'formDirective is null' error
This is my form:
<div class="container">
<form formGroupName="checkoutForm">
<section>
<div class="row">
<div class=&...
-1
votes
1
answer
45
views
NG01203: No value accessor for form control name: 'name'
This is a repost of the deleted question from JOYBOY with title NG01203: No value accessor for form control name: 'name'
I've created Angular 18 application. I'm using both combination of standalone ...
1
vote
2
answers
47
views
set angular required field if conditionally handle
here is my form:
initializePricingForm(): void {
this.pricingForm = new FormGroup({
price: new FormGroup({
selling_type: new FormControl('', Validators.compose([
Validators....
0
votes
1
answer
29
views
Angular Dynamic Reactive select option form
I'm building a multi-step form in Angular where users can create a Dungeons & Dragons character. In one of the steps, after the user selects a class (Bard, Cleric), they need to choose one ...
0
votes
0
answers
40
views
How can I dynamically handle TinyMCE fields in Angular when adding or removing fields?
addMenuItems() {
this.Form.valueChanges.subscribe((formValues) => {
this.tinymceElements = '';
for (let key in formValues) {
if (formValues.hasOwnProperty(key)) {
...
1
vote
2
answers
43
views
Error message not displaying when input is touched and invalid
I'm working on an Angular component where I want to display an error message if the input field is touched and invalid. However, the error message is not appearing as expected.
The error message "...
1
vote
1
answer
45
views
Error: NG01203: No value accessor for form control name: 'name'
Someone can help me please ? I have two components Parent and Child. In Parent Component I have this formGroup and two method to get person and city.
ngOnInit() {
this.form = this.fb.group({
...
1
vote
1
answer
35
views
How to use updateValueAndValidity()
I have two form controls as min and max. At the beginning min has a default value of 1 and max is empty. I want that max be always greater than min, so I defined a custom validator, which works nicely....
1
vote
2
answers
57
views
Angular - Custom form validator
I have two mandatory form controls as: minimumCharacters and maximumCharacters. I want to show an error, if the given maximumCharacters is smaller than the given minimumCharacters.
Here is how I have ...
0
votes
1
answer
62
views
Angular Error: NG8002: Can't bind to 'formGroup' since it isn't a known property of 'form'. [plugin angular-compiler] // Import declaration is made
I have declared ReactiveFormsModule in my app.module.ts like so:
app.module.ts
import { HttpClientModule } from '@angular/common/http';
import { CommonModule } from '@angular/common';
import { ...
1
vote
1
answer
52
views
How to use Angular Select
I want to select the data, which I previously designed as a different table in the backend section, with select and save it according to this selected operation. It seems logical to use angular ...
0
votes
1
answer
30
views
form not able to show invalid field when using a nested component
I have a form that looks like this:
form = formGroup({
name:FormControl(''),
adress:new FormGroup({
city: new FOrmControl(''),
})
})
and I use two components
parent:
<form [formGroup]=&...
0
votes
0
answers
30
views
Angular reactive forms dynamically added inputs not accepting input
I have a section where the user selects a type of element and a set of inputs are displayed based on that selection. This works as expected, with no error but the user can't type inside any elements ...
0
votes
1
answer
39
views
how to use child components with parent component - angular
I created this component called country-flag-dropdown.ts and html
Component:
import {Component, OnInit, Input, Output, EventEmitter} from "@angular/core";
import {FormGroup, FormControl} ...
1
vote
1
answer
30
views
Angular Reactive Forms Label Clipping
I'm posting this so I can solve it because it was a big problem for me until just now. Angular reactive forms with <mat-form-field> will clip half the label inside a flex-box without doing ...
0
votes
1
answer
28
views
How to mark a input field required when I select any value from a dropdown list in Angular 17 reactive form?
I have a dropdown list of 5 items.Whenever I choose a value from it one of my input fields will be marked as required. Otherwise the input field will be a non mandatory field.
How to dynamically mark ...
0
votes
0
answers
25
views
Angular form control ambiguous state
I'm trying to investigate why the control is marked as dirty at its initialization and what I see in the browser console is very confusing. The form control is either "dirty" OR "...
1
vote
1
answer
41
views
Angular mat-checkbox how to use with htminputelement?
In my project, I want to send it to the backend by setting true or false with the Angular Material Checkbox. I have tried different versions many times, but I am having problems sending information ...
1
vote
2
answers
53
views
Angular Input validate only on click. reset when user type or remove entire text
i have bellow form input
<form [formGroup]="userForm" novalidate>
<div class="field">
<label for="firstName" class="block">First Name<...
1
vote
2
answers
36
views
Error: control.registerOnChange is not a function with reactive form
I am trying to get the mat-select to open with 'tag2' selected. It works with a string[] but not with { id: number; name: string }[].
tags: { id: number; name: string }[] = [{ id: 1, name: 'tag1' }, ...
0
votes
1
answer
33
views
What is the "Angular way" of managing multiple checkboxes in reactive forms?
I'm trying to figure out the best way to manage multiple checkboxes in Angular reactive forms. I want the checkbox value to be sent along, so not "on" or "true", which it seems I ...
2
votes
1
answer
48
views
How to get the value from dynamically added nested form in angular using valueChanges?
I am dynamically adding formControl to a parent form by iterating an array of objects & want to track the change in these dynamically added controls by adding the valueChanges to the parent form ...
1
vote
1
answer
52
views
How to customize date validation error messages in Angular?
I am working on an Angular form where I need to validate a date input field. Currently, if I enter a non-date text like "Date" in the field, I receive the error message "Date is ...
2
votes
1
answer
53
views
Subtask is Updated Without Saving and Incorrect Icon Displayed on Reopening Task Dialog
I am encountering two issues with the subtask editing functionality in my application:
When I click the "Edit" button to edit a subtask and make changes, the subtask gets updated even if I ...
0
votes
0
answers
38
views
Initializing a boolean formcontrol as null with formbuilder
I'm trying to use a radio button to get a boolean value from a user. The value should default to null, as the user hasn't answered anything yet. Here is the current implementation that works, but is ...
1
vote
1
answer
82
views
Angular: TypeError: Type 'any' must have a Symbol.iterator method that returns an iterator
I'm encountering a "TypeError: Type 'any' must have a Symbol.iterator method that returns an iterator" error in my code. I'm trying to create a feature where users can input subtasks into an ...
2
votes
1
answer
108
views
Reactive form custom directives not run OnInit or when hidden input shown by *ngIf
Using reactive forms in Angular I created two directives one that converts values from cents to dollars by dividing by 100, and one that converts dollars to cents by multiplying by 100. This works ...
1
vote
1
answer
67
views
Reusable FormControl component implementing ControlValueAccessor
I am attempting to create a reusable custom-input component that does not have the formControlName hard coded anywhere in the custom-input component (I have found some examples where the ...
1
vote
1
answer
67
views
Error: Unable to convert "Invalid Date" into a date in angular
html:
<div class="form-group">
<nz-date-picker
class="mt-2"
formControlName="obsolete_date"
[nzDisabledDate]="disabledDate"
*ngIf="...
1
vote
2
answers
71
views
How to disable dynamic control in angular
I'm trying to create dynamic fields using this code
formInputfieldsForm: FormGroup[];
defaultFields: any = [
{ inputType: 'textbox', inputValues: '' },
{ inputType: 'textbox', ...
0
votes
1
answer
53
views
What is a good way to create a FormGroup using the DRY (Don't Repeat Yourself) principle?
I'm not convinced by the way formgroups are created in Angular.
I create forms like this:
let form = this._formBuilder.group({
nameAditionalCtrl: [adicional.nameAditional, [Validators....
0
votes
1
answer
37
views
How to use array of objects for controls in Form Group
I need to dynamically create forms in Angular. I have the following model:
values = [
{
id: 14,
group: 'basics',
field: 'food',
comment: 'Fine',
},
{
id: 15,
...
0
votes
0
answers
22
views
Implementing Dynamic Fields from database (Angular /.net)
I'm working on a project where I need to implement dynamic fields (input text, dropdown selects, date pickers) in templates and alerts, with these fields being generated from the database. I have ...
0
votes
1
answer
36
views
How to get a link to a subject in Angular?
I'm trying to write a directive that will be attached to a component and with this it will be possible to subscribe to its events. This directive should serve as a connector
@Component({
selector: ...
0
votes
1
answer
53
views
How to correctly transfer Children to the Angular Directive
I'm trying to pass all FormGroups that are in childrens to my directive. Why are they not transmitted?
I tried using ViewChildren and ContentChildren but the result is undefined
<div block="...
1
vote
1
answer
79
views
Cannot get an Angular reactive forms AsyncValidatorFn to debounce and set control error
I have an Angular reactive form where a form group has an expensive validation, so I wanted to try and debounce the call to the actual validation.
I found many other posts on this, for example here, ...
1
vote
0
answers
66
views
Rendering a dynamic form in angular using ControlValueAccessor causes ExpressionChangedAfterItHasBeenCheckedError
I would like to render an angular form dynamically, based on a json schema object that describes the fields. I would like to render multiple types of fields, but for this example I will only use text ...