title: Databinding Angular 2 reactive forms to json data
body: <p>I am using angular 2 data driven (reactive) forms. I am, trying to find a better way to map json data from a rest call to my form builder form. Currently, I am doing something like the following :</p>
  
  <pre><code>this.courseForm = this.fb.group({
      "Title": this.Title,
      "Author": this.Author
  });
  
  this.courseService.getCourse(id).then((course) =&gt; {
      this.courseForm.controls.Title.setValue(course.Title);
      this.courseForm.controls.Author.setValue(course.Author);
  })
  
  &lt;input type="text" formControlName="Title" /&gt;
  &lt;input type="text" formControlName="Author" /&gt;
  </code></pre>
  
  <p>It works, but requires I individually map each control to each property from the json object. With template driven forms, I only needed to do the following:</p>
  
  <pre><code>course: any[];
  
  this.courseService.getCourse(id).then((course) =&gt; {
      this.course = course;
  })
  
  &lt;input type="text" [(ngModel)]="course.Title" /&gt;
  &lt;input type="text" [(ngModel)]="course.Author" /&gt;
  </code></pre>
  
  <p>Not sure if I am missing something simple when it comes to binding data driven forms to json objects.</p>