angular-validation | 易学教程

How to add async validation without adding any other validators?

阅读更多关于 How to add async validation without adding any other validators?

问题 I am using angular 7, reactive form. I have a requirement to check the existence of particular value on the server to make field valid/invalid. Component Class: Control: valueControl = new FormControl("" ,Validators.required, ), [this.valueIsUnique.bind(this)]); /** * Validator to checking existance/uniqueness * of entered value * @param control */ valueIsUnique(control: AbstractControl): Promise<ValidationErrors|null> | null { if (control && (control.value !== null && control.value !==

setValidators in custom control without from reference in Angular

阅读更多关于 setValidators in custom control without from reference in Angular

问题 i have created a custom input control. I don't want to create any custom validation. I want to use default required, minLength, maxLength etc.I know i can do like this this.form.controls["firstName"].setValidators([Validators.minLength(1), Validators.maxLength(30)]); but i can't send form reference from parent component. How can i use setValidator inside textbox component. // input-box.component.ts import { Component, Input, forwardRef } from '@angular/core'; import { NG_VALUE_ACCESSOR,

Angular 4: reactive form control is stuck in pending state with a custom async validator

阅读更多关于 Angular 4: reactive form control is stuck in pending state with a custom async validator

问题 I am building an Angular 4 app that requires the BriteVerify email validation on form fields in several components. I am trying to implement this validation as a custom async validator that I can use with reactive forms. Currently, I can get the API response, but the control status is stuck in pending state. I get no errors so I am a bit confused. Please tell me what I am doing wrong. Here is my code. Component import { Component, OnInit } from '@angular/core'; import { FormBuilder, FormGroup

AngularJS form validation failing when input populated dynamic

阅读更多关于 AngularJS form validation failing when input populated dynamic

问题 I have the following form: If I click on a star, the input will be automatically populated with the number of the clicked star. (clicking on the 3rd star the input will be populated with number '3' like in the image bellow) The input bellow the stars is ng-required="true" . <form name="completeSurveyForm" role="form" novalidate ng-submit="vm.save()"> <ul class="question-list"> <li data-ng-repeat="question in vm.survey.questions | orderBy:'conditionalOrderId' track by question.id "> <small

Fire validation when focus out from input in angular?

阅读更多关于 Fire validation when focus out from input in angular?

问题 Email validation is being fired as we keep typing in textbox. I want this validation to be fired when user focuses out of the textbox Below is my code: <input class="form-control" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,3}$" name="Email" type="email" [(ngModel)]="model.Email" #Email="ngModel" required> <div class="red" *ngIf="Email.errors && (Email.dirty || Email.touched)"> <div [hidden]="!Email.errors.pattern"> Please enter a valid email. </div> </div> Please suggest me how can I

Form Builder with hasError() for validation throws an error of ERROR TypeError: Cannot read property 'hasError' of undefined

阅读更多关于 Form Builder with hasError() for validation throws an error of ERROR TypeError: Cannot read property 'hasError' of undefined

问题 Hi I am implementing a form in angular 2 using Form Builder in component.ts i have implemented my form using formGroup Below is My code public myForm: FormGroup; constructor(private authenticateservice: AuthenticateService, private _fb: FormBuilder ) { } ngOnInit() { this.myForm = this._fb.group({ address: [this.userDetails.address, [<any>Validators.required]], address2: ['', [<any>Validators.required]], city: ['', [<any>Validators.required]], company_address: ['', [<any>Validators.required]]

How to differentiate multiple Validators.pattern

阅读更多关于 How to differentiate multiple Validators.pattern

I have an input where user needs to type a longitude. I want to be able to display different error message when user types NaN or Not-Precise-Enough value. I'm using FormControl.hasError('ValidatorsName') to get the errors with validation, but it seems like I cannot differentiate those patterns. Template: <mat-form-field class="form-field"> <input matInput placeholder="Logitude" [formControl]="longitude"> <mat-error *ngIf="longitude.hasError('pattern')"> Longitude must be <strong>a number</strong> </mat-error>  <mat-error *ngIf="longitude

Best way to show error messages for angular reactive forms, one formcontrol multiple validation errors?

阅读更多关于 Best way to show error messages for angular reactive forms, one formcontrol multiple validation errors?

问题 I am showing reactive form error messages as per the suggested approach of angular angular form validation error example. html code of showing error on the page: <div [formGroup]="myForm"> <div> <input type="text" formControlName="firstName"/> <div *ngIf="myForm.controls.firstName.invalid" class="alert alert-danger"> <div *ngIf="myForm.controls.firstName.errors.required"> This Field is Required. </div> <div *ngIf="myForm.controls.firstName.errors.maxlength"> your can enter only 50 characters

Angular 4: reactive form control is stuck in pending state with a custom async validator

阅读更多关于 Angular 4: reactive form control is stuck in pending state with a custom async validator

I am building an Angular 4 app that requires the BriteVerify email validation on form fields in several components. I am trying to implement this validation as a custom async validator that I can use with reactive forms. Currently, I can get the API response, but the control status is stuck in pending state. I get no errors so I am a bit confused. Please tell me what I am doing wrong. Here is my code. Component import { Component, OnInit } from '@angular/core'; import { FormBuilder, FormGroup, FormControl, Validators } from '@angular/forms'; import { Router } from '@angular/router'; import {

Reactive Angular form to wait for async validator complete on submit

阅读更多关于 Reactive Angular form to wait for async validator complete on submit

问题 I am building a reactive angular form and I'm trying to find a way to trigger all validators on submit. If the validor is a sync one, it'd be ok, as I can get the status of it inline. Otherwise, if the validator is an async one and it was not triggered yet, the form on ngSubmit method would be in pending status. I've tried to register a subscribe for the form statusChange property, but it's not triggered when I call for validation manualy with markAsTouched function. Here's some snippets: /