reactive-forms | Complex forms with React? Easy! | Frontend Framework library

I am doing inline editing in my project, i am trying to patchvalue data from server, i have formarray inside the formArray for my accountNumbers array, but when i try to change value of inputs it gives error: Error: Cannot find control with path: 'type -> options -> 0 -> accountNumbers -> accountNumber' what am i doing wrong? here is my stackblitz

.ts

I've been beating my head trying to figure out why this parsing error keeps occuring.

Unexpected token [, expected identifier or keyword at column 13 in [zip.errors?.['required']]

I suspect the "?" is a query to the errors array looking for that key. My searches reveal nothing revealing about this "?" syntax. Typescript resources I've seen seem to assume I know how it's defined. I'm happy to be shown a pointer.

Thankfully, the code sample found on https://angular.io/guide/form-validation#validating-input-in-reactive-forms works so it doesn't seem like my Angular libraries are faulty. This is my most simple class and template after following the pattern of the working sample code.

donate.component.ts

I am try to create a simple form in angular using Anguar-reactive-forms.

In console I got this error. What is the mistake I did?

ERROR Error: formGroup expects a FormGroup instance. Please pass one in.

My service file

I have a scenario like Need to edit the single quotes values (only single quotes values),

So I extracted the single quotes values using regex and prepare the reactive dynamic form.

onclick of performing edit button will show old step name above, new step name below, submit step will replace the step name in the original array.

WOrking fine as expected in few scenarios according to my approach, but in scenarios, I realized whatever algorithm I am following does not fulfill my requirement.

Below are the test cases

Test case 1: Step Name: "Then I should hire an employee using profile '1' for 'USA'", // Here --> '1', 'USA' values are editable

Test case 2: "And Employee should be hired on '01' day of pay period '01' of 'Current' Fiscal" // '01', '01', 'Current'

Issues: in test case 2 if I tried to edit second 01 it is editing the first 01

I try to solve the perform edit function with help of indexof, substring functions

I am following the Angular reactive form unit testing guide here but am perpetually unable to get the control value and the HTML value to synchronize. Below is my implementation; note that I am trying to call setValue in addition to specifying default values:

So I have 2 angular apps and I'm using webpack module federation to import one into the other I got it working but I'm encountering some strange behavior. I think the problem is the same or similar to this but there's no answer and it's been some time.

In my remote app I have a div below a table that is only there while I'm getting the data from the database and then it's hidden. When i go to the remote it works fine no problem but when i use the shell the div was not being hidden. I then added a button to toggle the div visibility but what happened was that the div os duplicated when the bool flag turn true and nothing when it turned false. I then used the shell from this github and changed the flight component to be exactly the same as my remote component and imported my component and it happens only on my component. This can be seen in this video.

I believe the problem is in the remote and not in the host.

Host webpack.config.ts:

I'm building a reactive form in Angular 11. It's split up across multiple divs, and the project owner wants a few repeated inputs in each of those divs so that a user can edit an input for some field A, and all of the divs' inputs for field A will show the updated value.

I like corylan's approach:

I have a custom slide toggle component created using Angular Material. I followed this guide: https://material.angular.io/guide/creating-a-custom-form-field-control

Everything seems to be working fine except when I dynamically disable the custom component like this:

I have made a Stackblitz application where I am using a select box , with multiple selection . I want to default select the first item always , but I am unable to achieve it .

I am using selected ="i==0" but that doesnt help .