I know this is an old question, but if anyone looks for it, there is now a better way to set value in the whole form, with PatchValue: this.myForm.patchValue({ country: this.CountryResponse, name: ‘Any Name’ }); this also allows partial, so you would still be able to do something like: this.myForm.patchValue({ country: this.CountryResponse }); or you … Read more
<form [formGroup]=”form” (ngSubmit)=”onSubmit(form.value)” class=”form-horizontal”> <div class=”form-group row”> <label for=”inputEmail3″ class=”col-sm-4 “>Username</label> <div class=”col-sm-8″> <input formControlName=”email” type=”text” class=”form-control” id=”inputEmail3″ placeholder=”Email Address” [readonly]=”isReadOnly”> </div> </div> </form> please try like this change [formControl] to formControlName. And to set the output to the input field please do the following, point the line this.form.patchValue import { Component } from ‘@angular/core’; … Read more
In Angular 2 Final (RC5+) there are new APIs for updating form values. The patchValue() API method supports partial form updates, where we only need to specify some of the fields: this.form.patchValue({id: selected.id}) There is also the setValue() API method that needs an object with all the form fields. If there is a field missing, … Read more
You can subscribe to your form changes by using this : this.form.valueChanges.subscribe(() => { if (this.registerForm.controls[‘yourControlName’].value === ‘someValue’) { // } });
This behavior is expected. Angular forms are not automatically registered when inside nested component. However you can workaround this by providing the outer FormGroup to the child component. And inside the child component wrap the template inside that same group. Here is how this might look: /outer component code – it contains the form/ @Component({ … Read more
No idea why it behaves as it does, but you can send emitEvent: false to enable/disable without firing valueChanges. form.controls[‘firstName’].enable({ emitEvent: false });
In fact, the Http class doesn’t support that at the moment. You need to leverage the underlying XHR object to do that: import {Injectable} from ‘angular2/core’; import {Observable} from ‘rxjs/Rx’; @Injectable() export class UploadService { constructor () { this.progress$ = Observable.create(observer => { this.progressObserver = observer }).share(); } private makeFileRequest (url: string, params: string[], files: … Read more
I think, you don’t need this [checked]=”choice === defaultChoice”. Try this : <input type=”radio” id=”{{ groupName + choice }}” name=”{{groupName}}” [value]=”choice” [(ngModel)]=”defaultChoice” (ngModelChange)=”choose($event)” /> When [value] = [(ngModel)] the radio is selected.
In the new forms module this might do what you want <input type=”radio” name=”food” [(ngModel)]=”document.valid” [value]=”true”> <input type=”radio” name=”food” [(ngModel)]=”document.valid” [value]=”false”> see also design doc for the new forms module
You can subscribe to value changes of a control or the whole form. updateValueAndValidity allows you to modify the value of one or more form controls and the flag allows you to specify if you want this to emit the value to valueChanges subscribers.