angular2 and formControlName value in template

Question

Oh angular2...why so hard?

{{exposure}}

Answer 1

The formControlName directive is designed to be used with a parent FormGroupDirective (selector: [formGroup]).

It accepts the string name of the FormControl instance you want to link, and will look for a FormControl registered with that name in the closest FormGroup or FormArray above it.

Use form.get('exposure').value to get the control value.

Example:

    
    {{ form.get('exposure').value }}

Alternatively

In your component class, define a getter property representing your form control:

export class MyComponent {
  form = new FormGroup({
    exposure: new FormControl('')
  });

  get exposure(): FormControl { return this.form.get('exposure'); }

Then, in your component template, you can reference exposure:

{{exposure.value}}