title: setValue on FormControl is not reflected in View
body: <p>I want to load an existing value into a FormControl to be able to update the value in my database.</p>
  
  <p>My code (shortened and boiled down to an example) looks as follows. Clicking the edit button shall load the referring name from the array into the FormControl.</p>
  
  <p><strong>App-Component</strong></p>
  
  <pre><code>import { Component } from '@angular/core';
  import {FormControl, ReactiveFormsModule} from '@angular/forms';
  
  @Component({
    selector: 'my-app',
    templateUrl: './app.component.html',
    styleUrls: [ './app.component.css' ]
  })
  
  export class AppComponent  {
  
    nameForm = new FormControl(['']);
    names = ['Peter', 'Bob', 'Mary']
  
    updateName (id : number): void {
        this.nameForm.setValue(this.names[id]);
    }   
  }
  </code></pre>
  
  <p><strong>HTML-Template</strong></p>
  
  <pre><code> &lt;table&gt;
              &lt;tr&gt;
                &lt;th&gt;Id&lt;/th&gt;
                &lt;th&gt;Name&lt;/th&gt;
                &lt;th&gt;Actions&lt;/th&gt;
              &lt;/tr&gt;
              &lt;tr *ngFor="let name of names; index as i"&gt;
                  &lt;td&gt;{{i + 1}}  : &lt;/td&gt;&lt;td&gt;{{name}}&lt;/td&gt;
                    &lt;td&gt;
                      &lt;button (click)="updateName(i)"&gt;Edit&lt;/button&gt;
                    &lt;/td&gt;
              &lt;/tr&gt;
      &lt;/table&gt;
  &lt;input type="text" formControlName="nameForm"&gt;
  </code></pre>
  
  <p>I have constructed an example on <a href="https://stackblitz.com/edit/angular-m7vm4y" rel="nofollow noreferrer">https://stackblitz.com/edit/angular-m7vm4y</a>.
  Clicking on edit does not set the value into the FormControl. Where is my mistake?</p>
  
  <p>Thanks and best!</p>