angular-reactive-forms

I am working on the reactive forms and I am not able to get the specifically the form control which has changed or updated from UI rather getting the whole form . I tried using valueChanges() but it returns the full form itself rather than giving me the specific changed form control . I tried using the valueChanges() method but no getting what i am expecting You can subscribe to specific form control rather than the entier form lie this way this.form.get('userName').valueChanges(value=> console.log('name change',value)) you can manage subscribe to form controls dynamically like this this.form

using primeNg dropdown component, I'm trying to initialized the dropdown with initial value with no success, I'm using reactive approach. I checked the primeNg documentation and demos - almost all the examples there are using template driven, I would like to have the same with model driven. I'm able to render the dropdown with the values in the list but the selected item is not the one I declared in the form, instead it's the first item in the list. my code: template <div [formGroup]="formGroup"> <p-dropdown [options]="results" formControlName="second" (onChange)="onChangeHandler($event)"

I'm trying to create nested reactive forms here : https://stackblitz.com/edit/angular-mgrfbj This is the project heirarchy: ---create company form (hello.component.ts) --- company details form (company-details.component.ts) --- [ employee details form (employee-details.component.ts) employee details form employee details form ... ] For such nested forms, I have to use ViewProviders and FormGroupDirective as given in this video : The first nested form ( company-details.component.ts ) is working as expected But the second form which is added with *ngFor inside a FormArray is not binding to the

I am new to Angular 2 and unable to resolve this issue even after going through other stack overflow answers. I have just now started learning angular reactive forms and want to try the first example but am stuck. Please help. Here is the HTML form. <div class="container"> <div class="row"> <div class="col-xs-12 col-sm-10 col-md-8 col-sm-offset-1 col-md-offset-2"> <form [formGroup]="signupForm" (ngSubmit)="onSubmit()"> <div id="user-data"> <div class="form-group"> <label for="username">Username</label> <input type="text" id="username" formControlName="username" class="form-control"> </div>

addStop() { const control = <FormArray>this.editForm.controls['stops']; control.push(this.initStop()); } I have this code to add a "stop" at the bottom of the form array. But I want to add the new "stop" not to the last position, but one position before the last stop. This doesn't work for example (not at all, I know that the numbers are wrong. Splice function doesn't exist at ) control.splice(2, 0, this.initStop()); Use FormArray#insert : control.insert(<position>, this.initStop()); 来源： https://stackoverflow.com/questions/44489034/angular-form-array-push-specific-index