reactive-forms

Angular2: email already exist as custom Validator?

由 ∥☆過路亽．° 提交于 2019-12-11 06:55:39
问题 I created a form with Angular2 and I created the following method to check if the email address already exist. Here is my code: checkEmail(): void { // FIRST PART this.found = false; // If user is not Premium... if (!this.currentUser.isPremium) { // ...and if user typed something in the input field, then apply validitor for email address if (this.myForm.controls.email.value.length > 0) { this.myForm.controls.email.setValidators([validateEmail()]); this.myForm.controls.email

Angular FormControl check if required

由 断了今生、忘了曾经 提交于 2019-12-11 02:26:49
问题 Is there a way to check whether control is required? The problem arose when I implemented a dedicated form field component which accepts FormControl and has not only input but also validation errors. Since some field are required it's good to let the user know if it's required by * . Is there a way to check the @Input() control: FormControl for Validators.required and display an asterisk? 回答1: You can do something like this: import { Component } from '@angular/core'; import { FormGroup,

Best way to implement Angular cross field validation

由 淺唱寂寞╮ 提交于 2019-12-08 14:12:19
问题 I am trying to figure out the best way to implement cross field validation in Angular. For example, I have a select field that makes another field mandatory. I want to be able to: Change the border color of the field if it is invalid Display a * in front of the field whenever it becomes mandatory Display a specific error message that explains what validation rule is broken. So far, I came up with three solutions but they don't feel so convincing to me. Listen to select field changes and

Setting Angular 2 FormArray value in ReactiveForm?

由 不问归期 提交于 2019-12-07 00:24:42
问题 There is already a similar question here (Setting initial value Angular 2 reactive formarray) but I am not satisfied with the answer or maybe looking for some other solution. I think whole point of having FormArray is to pass the array of objects and it should create equal number of components. But in this above example if you look at the provided plunker , even after providing two Addresses object one Address was created because its blank version was already created in ngOnInit() . So my

Angular strongly typed reactive forms

由 时光总嘲笑我的痴心妄想 提交于 2019-12-06 07:25:36
问题 I'm looking to refactor a large set of components in my Angular project to have strongly typed FormGroups, FormArrays, and FormControls. I'm just looking for a good way to implement strongly typed reactive forms. Could anyone provide suggestions/recommendations from their own experiences? Thank you. EDIT: To clarify, by strongly typed I mean currently when I create a FormGroup or FormArray I have no way to specify the structure of the actual form inside it. When I pass this form around to

Angular 2 - Can't set form array value

由 倾然丶 夕夏残阳落幕 提交于 2019-12-05 16:08:46
问题 I get this error: There are no form controls registered with this array yet. If you're using ngModel, you may want to check next tick (e.g. use setTimeout). When using this code: public settingsForm: FormGroup = this.fb.group({ collaborators: this.fb.array([]), rsvp: this.fb.group({ latestDate: ['', [Validators.required]], latestTime: ['', [Validators.required]], guestLimit: ['', [Validators.required]], isRSVPOpen: false, isGuestPlusOne: false, isAutoApproveToGuestlist: false,

Angular2 - How to set `touched` property on form to true

由 谁说胖子不能爱 提交于 2019-12-05 09:55:09
问题 I have a reactive form in my component and I want to set the touched property on every one of the inputs equal to true . My current code does this, but it throws the error Cannot set property touched of #<AbstractControl> which has only a getter : addressForm: FormGroup; ... this.addressForm = this._fb.group({ street: ["", [<any>Validators.required]], city: ["", [<any>Validators.required]], state: ["", [<any>Validators.required]], zipCode: ["", [<any>Validators.required]], country: ["", [<any

Setting Angular 2 FormArray value in ReactiveForm?

由 心不动则不痛 提交于 2019-12-05 03:36:47
There is already a similar question here ( Setting initial value Angular 2 reactive formarray ) but I am not satisfied with the answer or maybe looking for some other solution. I think whole point of having FormArray is to pass the array of objects and it should create equal number of components. But in this above example if you look at the provided plunker , even after providing two Addresses object one Address was created because its blank version was already created in ngOnInit() . So my question is if in ngOnInit() I have it like this addresses: this._fb.array([]) // blank list, then how

Angular2 - How to set `touched` property on form to true

由 和自甴很熟 提交于 2019-12-05 00:06:10
I have a reactive form in my component and I want to set the touched property on every one of the inputs equal to true . My current code does this, but it throws the error Cannot set property touched of #<AbstractControl> which has only a getter : addressForm: FormGroup; ... this.addressForm = this._fb.group({ street: ["", [<any>Validators.required]], city: ["", [<any>Validators.required]], state: ["", [<any>Validators.required]], zipCode: ["", [<any>Validators.required]], country: ["", [<any>Validators.required]] }); ... for (var key in this.addressForm.controls) { this.addressForm.controls

How to validate reactive forms with nested form groups?

由 若如初见. 提交于 2019-12-04 13:51:52
问题 I'm working on creating a nested form group as shown in https://plnkr.co/edit/c93yFe2r83cvjiRvl6Uj?p=preview. This is a fork of example from https://angular.io/docs/ts/latest/cookbook/form-validation.html#!#reactive The example in Angular shows using validationMessages when the form does not have any nest groups. I'm not sure how to extend this when I have nested form groups. Following are sample form and validation messages I would create. buildForm(): void { this.heroForm = this.fb.group({
订阅 reactive-forms