title: Populate FormGroup with null value and
body: <p>Getting error in Chrome Console: EXCEPTION: Error: Uncaught (in promise): TypeError: Cannot read property 'applicationName' of null.</p>
  
  <p><strong>Model:</strong> 
      export class BasicInfoModel {</p>
  
  <pre><code>    applicationName: string;
      localDirectoryPath: string; 
  }
  </code></pre>
  
  <p>Controller emitting data to parent component, parent component there it is saved to services.</p>
  
  <p><strong>Controller:</strong></p>
  
  <pre><code>import { Component, Output, OnInit, EventEmitter} from '@angular/core';
  import { FormGroup, FormControl, REACTIVE_FORM_DIRECTIVES, Validators,               
  FormBuilder, FormArray}from "@angular/forms";
  import { Observable } from "rxjs/Rx";
  import { BasicInfoModel } from '../basicinfomodel';
  import { BasicInfoService} from '../app.dev.basicinfo.service';
  
  @Component({
     selector: 'basic-info',
     templateUrl: './basicInfo.html',
     styleUrls: ['../../ComponentStyles.css'],
     directives: [REACTIVE_FORM_DIRECTIVES]
  })
  
  export class BASIC_INFOComponent implements OnInit {
  
  observableBasic: BasicInfoModel;
  basicInfoForm: FormGroup;
  
  @Output() basicInfoUpdate = new EventEmitter&lt;JSON&gt;();
  @Output() basicInfoFormValid = new EventEmitter&lt;Boolean&gt;();
  
  constructor(private formBuilder: FormBuilder, private BasicInfoService:      
  BasicInfoService) {  }
  
  onSubmit() {
      debugger;
      this.observableBasic;
      this.basicInfoUpdate.emit(this.basicInfoForm.value);
  }
  
  ngOnInit() {
  
      this.basicInfoForm = new FormGroup({
          'applicationName': new FormControl('', Validators.required),
          'localDirectoryPath': new FormControl('', Validators.required)
      });
  
      this.basicInfoForm.valueChanges.subscribe(data =&gt; console.log('form   
      changes', data));
      this.BasicInfoService.currentBasicInfo
          .subscribe(
          (basic: BasicInfoModel) =&gt; {
              this.observableBasic = basic;
          });
  
      (&lt;FormGroup&gt;this.basicInfoForm).setValue(this.observableBasic, { onlySelf: true });
  }
  
  }
  </code></pre>
  
  <p><strong>What i want to achieve:</strong></p>
  
  <ol>
  <li>When i build my code, i want my formGroup should be populated with null values.</li>
  <li>when i filled the data and saved it to behaviourSubject in my services, latter when i revisit the page my formGroup should be in sync with data services.</li>
  </ol>