reactive-forms

Angular form validation: compare two fields in different form groups

人盡茶涼 提交于 2021-02-19 02:24:24
问题 I'm sorry if it's a duplicate of someone question. I didn't find a solution for my problem. Can anybody explain or give an example how to compare two fields in one form but in different form groups? Here is code snippet to see how my form and validator are look like: private createForm() { const testGroups = { groupOne: this.fb.group({ fieldOne: this.fb.control(null) }), groupsTwo: this.fb.group({ fieldTwo: this.fb.control(null, [this.matchValidator]) }) }; this.testForm = this.fb.group

Created custom radio button library, but did not check radio button while binding with reactive-form

£可爱£侵袭症+ 提交于 2021-01-28 14:13:18
问题 Angular library I am trying to created a library for custom radio button with its role like warning(color yellow dot) error(color red dot) info(color blue dot) and success(color green dot) without angular library it will work fine, After that I move my css and template to library but now it is not work is expected I have provide value from reactive from but it does not check as expect I have also added screenshot at the end what I am expecting and what I get currently radio-button.html <label

How to render dynamic checkbox conditionally in Reactive forms

和自甴很熟 提交于 2021-01-07 03:22:54
问题 I'm trying to create dynamic checkbox list conditionally on a value select Tried various solution online but unable to get the expected result. Also, Facing issues with binding value to form-control Final result is expected to be a formdata of below format on submit: { name:"new Experiment", depth: 'Exp Wise", durationPerDepth:[{ exp:"exp1", duration:"10mins" ]} } -----OR--- { name:"new Experiment", depth: 'For All", durationPerDepth:[{ exp:"All", duration:"10mins" ]} } for_all[ ] set_for_all

How to render dynamic checkbox conditionally in Reactive forms

a 夏天 提交于 2021-01-07 03:22:17
问题 I'm trying to create dynamic checkbox list conditionally on a value select Tried various solution online but unable to get the expected result. Also, Facing issues with binding value to form-control Final result is expected to be a formdata of below format on submit: { name:"new Experiment", depth: 'Exp Wise", durationPerDepth:[{ exp:"exp1", duration:"10mins" ]} } -----OR--- { name:"new Experiment", depth: 'For All", durationPerDepth:[{ exp:"All", duration:"10mins" ]} } for_all[ ] set_for_all

Display and update FormGroup inside FormArray

流过昼夜 提交于 2020-06-17 13:14:25
问题 I am displaying a FormArray with an *ngFor. What i am trying to do is when i click on an item in the ngFor, to populate the with that items 'task' property. Additionally, when i type/update the contents of input, the original form is updated/patched. HTML: <form [formGroup]="myForm"> <div [id]="i" class="example-box" *ngFor="let item of myForm.get('items').controls; let i=index;" (click)="updateInput(item)"> {{item.value.task}} to be </div> <br> <br> <input formControlName="xxx" /> <br> <br>

How to bind the date values to its particular field in angular8

馋奶兔 提交于 2020-04-18 05:42:11
问题 i am using bootstrap date picker, in which if i select date for one field, the same date is replicating to the other fields as well. I want the selected date to be binded to the formcontrolName instead of taking only one value at a time. DEMO TS: focusEffectivDate(name) { $('.onlyDate').datetimepicker( { format: 'L' }).on('dp.change', (e) => { const date = e.date.format('L'); if(name == 'effectiveDate') { this.eoInfoForm.get('effectiveDate').setValue(date, { emitEvent: false }); } else if

Recursive ReactiveForm cannot find formGroups inside of template

橙三吉。 提交于 2020-03-23 12:20:10
问题 I am using a meta-data object to dynamically create a very large form (~400 inputs, though a small sample is shown in stackblitz example). I need to use the meta-data structure to carry input-specific information to the inputs (i.e. type of input, select options, step size, etc). When my html ng-template gets called recursively inside of a and subsequently , the parent form is not recognized. When I get past the initial recursion level, the ReactiveForm cannot trace to the desired formGroup.