81 questions
1
vote
1
answer
41
views
Angular Form Group is not clearing conditional validator errors
I have a dropdown, and based on the selected option, I display specific form controls. For the dropdown option value2, I display an error message: "Please provide either the Body or both Username ...
2
votes
2
answers
238
views
Why aren't the validation errors in this custom Angular control visible from the parent component's form?
I'm working on my first custom control in Angular (16), for a Reactive Form, that contains a slider and an input. If the slider is true, then the input should have a value. If it is not, then the ...
- 8,611
1
vote
2
answers
90
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 ...
- 621
1
vote
2
answers
2k
views
Where should I write my Validators in Angular 17?
I am using Angular 17, and I need to write some custom validators for my reactive typed forms. I was going to write them in the component where my form is declared, but I know these validators are ...
- 202
0
votes
0
answers
41
views
To set Validation And retain the error in the required field
I have three input fields: two dropdowns and one slider number field. In my custom validation, I utilize the form control names as strings within the service field to capture the value changes of the ...
0
votes
0
answers
42
views
Cross Field Validation for password not invoked/working
Clearly password and confirmPassword don,t match but still no error is being shownISSUE:
creating a password validator to cross check with confirm password if it does not matches(as shown in ...
0
votes
3
answers
991
views
Validate against NaN values for <input type="number">
I am creating a form using Angular Reactive forms, and for UX reasons I am trying to disable the form's submit when certain invalid values are inserted in an <input type="number"> ...
- 1
0
votes
2
answers
44
views
email input should be red like other input but is doesnt
the input email like firs name and last name is invalid but the color on CSS dent match. I don't know what is a difference between this tow I change type of email to text but no direness the email ...
0
votes
1
answer
364
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
1
vote
1
answer
986
views
Unsafe assignment of an `any` value Error on form variables (Angular Validators)
I am trying to get my form variables checked by eslint. Unfortunately, in this file:
import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/...
- 27
-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 ...
0
votes
1
answer
276
views
Can't get through with async validators
So, I have a blog, and I'm trying to setup a check, on the creation of a new text, to lock the form if the title already exists.
I got a TextService
export class TextService {
private _url = "...
- 15
1
vote
1
answer
3k
views
Type 'null' is not assignable to type 'ValidationErrors'
So, my issue is I am trying to build a custom validator on Angular 15, and I get an error message that tells this:
Type 'Observable<{ titleAlreadyExists: boolean; } | null>' is not assignable ...
- 15
0
votes
0
answers
61
views
Unable to check for error on the HTML DOM for Angular Reactive From CustomValidator
I am trying to create a custom validator for an Angular reactive form that checks for the existence of a username in a Firestore database. The validator is working as expected and returning the ...
- 546
1
vote
1
answer
308
views
Angular Cross-field validation on Dynamic Form
I built a dynamic reactive form that reads a json file (or just json in general) and renders the form elemtns for the user here.
https://stackblitz.com/edit/angular-empty-project-qzjttt?file=app%2Fapp....
- 19
0
votes
0
answers
113
views
Custom validator on 3 separate dates
I wrote a dynamic form that triggers three dates if the user clicks any of the checkboxes (the logic here isn't important.. clicking any of the checkboxes would show the dates).
The issue is trying to ...
- 19
0
votes
1
answer
1k
views
How to know which field has fired cross-validation in FormGroup Validator
My answer is about cross field validation in Angular Form (check the documentation here cross-field-validation).
I would like to know how to find which field's change has fired the form validator when ...
- 125
0
votes
0
answers
619
views
Getting current input value in angular template driven form validator
I have a question regarding an input element type number that I want to validate in a template-driven form:
As the first goal, it should accept only positive integer values. For this, I have created a ...
- 55
0
votes
2
answers
373
views
Custom Validator update help Angular 14
I have my form and my custom validator right here, with logic that I think should work. I have 15 fields, 3 in which the custom validator refers to ('icmp','tcpPorts','udpPorts'). Along with the other ...
- 11
0
votes
1
answer
415
views
Custom Validator Help Angular 14
I've been hung up on really understanding how to implement a custom validator inside of my reactive form.
I have 15 fields, 3 in which pertain to the custom validator "tcpPorts", "...
- 11
-1
votes
1
answer
765
views
AbstractControl.value[data] is retuning undefined in Custom Validator using AbstractControl?
I'm trying to write cross-field -validation using Abstract Control.
control.value[start] is showing undefined. kindly help me on solving.
working code is here.
app.component.html
export class ...
- 47
2
votes
4
answers
8k
views
Angular custom validator not firing when input untouched?
I have a reactive form as following:
this.form = this.formBuilder.group({
name: ['', Validators.required],
email: ['', this.customValidator()]
});
I also have a "submit" button with a [...
- 2,026
1
vote
0
answers
816
views
Jest unit test for angular custom validation to select atleast one control in formgroup
I'm writing a unit test with jest cases for angular custom validator which is user must select atleast one filter in formgroup. I'm new to angular unit test. Please let me know what I have missed?
...
- 291
0
votes
1
answer
2k
views
Using Angular Validators to create a restriction of 6-12 characters, but NOT of length 9
I am trying to create a Angular Validator that allows me to validate
a string of both letters and characters of lengths 6-12 inclusive, but not of length 9.
I have tried
RegexAlphaNumeric = "^[a-...
0
votes
1
answer
4k
views
How can validate invalidate date in angular by using custom validation
I am creating a date validator by using custom validator but when I print the error it shows null.
I am trying to enter inter date like 2222-22-22 it accept, here I have use custom validator to ...
1
vote
1
answer
4k
views
Angular - Type '(c: FormControl) => ValidationError | null' is not assignable to type 'ValidatorFn'
In Angular-13 I have this code
validation-errors.ts:
import { ValidationErrors } from "@angular/forms";
import { FormArray, FormControl, FormGroup, ValidatorFn } from '@angular/forms';
// ...
- 1,067
0
votes
2
answers
109
views
Angular: Cyclic Dependency
Why is currentdate in this.currentdate.getTime() coming back as undefined?
newlisting = this.formBuilder.group({
availabledate: new FormGroup({
xyz: new FormControl()
},[this.mainservice....
0
votes
1
answer
849
views
Custom validation function for from and to time field in angular form which is an optional field
I am working on form in angular And there is an optional field which has from and to time and I have to make condition that I only enter the from time or to time and not both times then I should see ...
- 11
1
vote
0
answers
87
views
Angular creating custom reactive form validator
I created simple ValidatorFn function:
requiredArrayLength(length: number): ValidatorFn {
return (control: AbstractControl): ValidationErrors | null => {
if (length >= 1) {
...
- 1,048
0
votes
1
answer
87
views
Custom Validator on Angular logic gets implemented successfully but does not show the error message on my web page UI /HTML
so I was doing a custom validator on my Angular form which works in the following way:
excerpt from my component.ts file:
creteRoute(): FormGroup {
return this.fb.group({
'...
- 81
1
vote
1
answer
6k
views
Custom Validator Not Working in Angular Reactive Form
I am trying to create a custom validator that checks if a phone number already exists.
My code is as follows:
Validation Function
phoneValidator() {
return (control: AbstractControl): Observable&...
- 133
0
votes
1
answer
378
views
Angular 11 Custom ISBN Validator Reactive Forms
I'm doing a custom validation for an ISBN number, I already have the function that checks the number and works perfect giving me the response by console, but I need to do the custom validator to get ...
- 397
2
votes
1
answer
2k
views
Wait for async validators to finish angular forms
I have an angular form with custom aync validators
I want to do some stuff if the form is invalid on load.
Here is the code
ngOnInit() {
this.signupForm = this.fb.group({
name: [
...
- 506
0
votes
1
answer
255
views
Async validator for unique userId not working
Inside service-
getUserIdToCheckDuplicate(userId:any):Observable<any>{
const url = ``; //url goes here
return this.http.get<any>(url);
}
Inside component-
ngOnInit(): void {
...
- 37
0
votes
0
answers
1k
views
Angular custom component show invalid form elements on submit
I have a reactive form which containing several custom form component. I have created this components to use in several forms and I have inherited from "ControlValueAccessor" interface, it ...
- 7,161
2
votes
1
answer
4k
views
Display cross field custom validation error message
In my reactive form i have built a custom validation for 3 input fields. The main function of the validation is to return a error when either 1/2 out of 3 input fields have a value (I want all 3 ...
- 138
0
votes
1
answer
1k
views
Angular (12.0.5) Formbuilder regex validation
I am trying to validate passwords, postal codes and phone numbers using the Angular pattern validators.
For some reason the password and postal code validation just don't seem to work, no matter which ...
0
votes
1
answer
122
views
Run control Validators on custom value or how not to run them at all
Long stroy short, i'm currently working on a directive that applies a function to a control value when modified. That function modifies the control value only in on the model side. That goes like this ...
- 394
1
vote
1
answer
432
views
In Angular how can custom validators be used in material dialog template
I have a data entry form in a Material Dialog as a Template form. I want to apply some custom validators to some of its Input fields.
I'm not having any success making them fire (although I tested one ...
- 670
1
vote
1
answer
4k
views
Pass a dynamic parameter in reactive form custom validator
I would like to pass a variable as a parameter in a custom validator like this
newSimulation: new FormControl('', [uniqNameValidator(this.options)])
Then use it in my custom validator
export ...
- 5,315
0
votes
1
answer
3k
views
Mat error is not displaying error for custom validators but template is displaying error
app.component.html
<div class="col-sm-3">
<mat-form-field class="col-sm-3" appearance="outline"
...
- 761
7
votes
1
answer
6k
views
Angular Unit Test for Custom Validator FormGroup
How to unit test (Jest here) custom validator, which has FormGroup? I've seen this question, but it's about FormControl.
The function to be tested.
import { FormGroup } from '@angular/forms';
/**
* @...
- 10.9k
1
vote
1
answer
1k
views
Angular custom validator with http don't work
I try to make a custom validator who verify that a serial number exist in my database.
To do this, the custom validator must call an api endpoint.
This is my custom validator
import { Injectable } ...
- 57
0
votes
1
answer
1k
views
Angular async validator check unicity of input in database
I have an <input> where the user enter a value that is supposed to be unique in database. I want to check dynamically in the front-end if that value is unique or not.
I want also to display an ...
- 112
-1
votes
1
answer
186
views
FormControl.Validators.pattern does not work correctly, while Regex with same string shows that data matches [duplicate]
I am trying to create pattern for phone numbers and I want to look it like this:
+375 29 555 55 55
80-33-555-555-55
+375-25-555-55-55
80445555555
etc.
I wrote following code:
.ts
phoneFormControl =...
- 45
0
votes
1
answer
2k
views
Angular custom validator for hours input in HHH:MM format
I need to validate input in hours and minutes but it is strange format of 6 characters in HHH:MM.
For example 30hrs and 15 mins is needed to be entered in the input like 030:15
My attempt to create ...
- 1,307
1
vote
1
answer
2k
views
Angular Reactive form not updating when FormGroup has new error
So I declare my FormGroup in ngOnInit() and that calls my validator function to ensure that password and confirmPassword fields are matching as so
My typescript
regForm: FormGroup;
constructor() { }
...
0
votes
1
answer
176
views
What exactly is the error in my Validator class or the observable pipe that this error keeps occuring in my console?
Errors keep appearing on my console after a while. Can anyone please tell me is it because of the flaky API? I am a beginner in Angular
Async Validator Class:
import { AsyncValidator, FormControl } ...
- 43
2
votes
1
answer
839
views
Custom validator with parameter is not working for textbox and checkbox in angular
In my reactive form, I have a textbox and a checkbox. I want that when the checkbox is checked, then textbox can be null or empty. If checkbox is not checked then validation message should be shown ...
- 1,772
0
votes
0
answers
392
views
Custom validator is not working in FormGroup in Angular 10
In my reactive form I have two password fields. Two match the two field's value I have created a custom validator and then assign that validator in form group in ts file. The code is below:
this....
- 1,772