Предварительно заполнить поле ввода в `FormGroup` - Angular2

ОБНОВЛЕНИЕ. Как мы выяснили, вам нужен formArray вместо одного formControl. Итак, объявите, что при построении формы:

this.queryForm = this.fb.group({
  arrayOfData: this.fb.array([]) // name a proper name to array
})

Вы можете использовать setValue или patchValue, когда вы получили свои данные, где вы повторяете ответ и исправляете значения в своем массиве формы. Вызвать patchValues-метод в обратном вызове (подписаться).

patchValues() {
  const control = <FormArray>this.queryForm.get('arrayOfData');
  this.items.forEach(x => {
    control.push(this.patchValue(x.first_name, x.pcode))
  })
}

patchValue(name, code) {
  return this.fb.group({
    name: [name],
    pcode: [code]
  })    
}

В вашем шаблоне выполните итерацию по массиву форм, а также не забудьте установить имя группы форм (которое является индексом):

<div formArrayName="arrayOfData">
  <div *ngFor="let code of queryForm.get('arrayOFData').controls; let i = index">
    <div [formGroupName]="i">
      <label>Name: </label>
      <input formControlName="name" /><br>
      <label>Product Code: </label>
      <input formControlName="pcode" /><br>
    </div>
  </div>
</div>

Исходный ответ:

Вы всегда должны устанавливать значения формы в компоненте, а не в шаблоне. Вы можете использовать patchValue или setValue, когда получили значение от службы ... так что вы можете сделать это, например, внутри обратного вызова (подписаться):

this.myService.getSomeData()
  .subscribe(data => {
     this.item = data;
     this.queryForm.patchValue({pcode: this.item.productCode})
  });

Тогда вам не нужно использовать [value]="item.productCode" в вашей форме, вместо этого это значение устанавливается с помощью элемента управления формы.