reactive-forms

问题 I'm trying to create a Reactive Form in Angular 4.0.2, which has a <textarea> field with default content, pulled from the database. The content in the <textarea> is showing without any issues, but when I add the formControlName="sectionContent" to the <textarea> element, the content from it disappears. <textarea formControlName="sectionContent ">{{ section.sectionContent }}</textarea > This issue is only happening with the <textarea> element, as I have other <input> fields in the form, but

问题 My objective is to put all my validation messages in component instead of html file I have a sign up page and below is the fields: public buildRegisterForm() { this.userForm = this.fb.group({ firstName: ['', [Validators.required, Validators.minLength(3)]], lastName: ['', [Validators.required, Validators.maxLength(50)]], emailGroup: this.fb.group({ email: ['', [Validators.required, Validators.pattern(this.emailPattern)]], retypeEmail: ['', Validators.required], }, { validator:

问题 I have the following code that dynamically adds a form group containing a title and two radio buttons to create a condition, effectively providing its title and whether or not it's an acceptable condition: export enum Acceptability { ACCEPTABLE, INACCEPTABLE } export interface Condition { title: string; acceptability: Acceptability; } export class AddCondition implements OnInit { form: FormGroup; ACCEPTABILITY = Acceptability; constructor(private fb: FormBuilder) {} ngOnInit() { // build the

问题 I am attempting to create a form for a user that will allow one to may phone numbers to be associated with the user. Is this possible with the current implementation of reactive forms? For example, I would want the below form to accept potentially many phone numbers. My front end implementation would show the phone number field, and would have a button that would allow for an additional phone number field to be added. userForm = new FormGroup({ firstName: new FormControl('', Validators

问题 I have 2 input fields: name and last name. I have 2 buttons: submit and 'add a person'. Clicking on 'add a person' should add a new set of fields (name and last name). How to achieve that? I found solutions how to add single input fields dynamically, but here I need to add a set My code now without 'add a person' functionality: import { FormControl, FormGroup, Validators } from '@angular/forms'; export class AppComponent implements OnInit { form: FormGroup; constructor(){} ngOnInit(){ this

问题 I am using Angular 7, Angular Material controls with Reactive Forms. I created custom text (matInput type="text"), number (matInput type="number"), select (matSelect) controls with Angular Material with mat-form-field Here is the stackblitz for my example. I am trying to attach the custom form controls to reactive form and trying to fire any validations on the form group automatically. I am using ControlValueAccessor to achieve this, however my Select is not being identified as form control

问题 I have several categories and each category has several materials/products. I have a problem since when i decided to delete a material/product on a category, I also delete a material/product in another category? How would able to fix this using reactive forms? How would i independently delete one material only and not another? This is the link to my code CODE LINK patchValues() { let rows = this.myForm.get('rows') as FormArray; this.orders.forEach(material => { material.materials.forEach(x =>

问题 I need help in my problem since i need to input only the quantity based on the available quantity on my rows? How can i only submit the button if this requirement is met? How can i check for this? Here's the link LINK CODES initGroup() { let rows = this.addForm.get('rows') as FormArray; rows.push(this.fb.group({ ingredient_id: ['', Validators.required], qty_available: new FormControl({ value: '', disabled: true }, Validators.required), qty: ['', Validators.required] })) } 回答1: //when push the

问题 This is so commonly used, there must be a simple way to approach this! So here is the situation. I have a form group: <ion-item-group formGroupName="alternativeRevenue"> <ion-item-divider color="primary" text-wrap sticky>Alternative revenue </ion-item-divider> <ion-item> <ion-label>Branded content</ion-label> <ion-toggle formControlName="brandedContent"></ion-toggle> </ion-item> <ion-item text-wrap *ngIf="businessFoundationsForm.get('alternativeRevenue.brandedContent').value"> <ion-label

问题 What I want to achieve is something like this: When the user clicks on Submit button, in the background I need to compare if the state of the form has changed, by state I mean if there is at least one change in the form and only then call the API/Server to save information. If there are not any changes, just show a warning message to the user - "Hey you need to update something!"(console.log() is enough) *I also need to handle this case when the user changes something in the field1, for