Angular 2 md-select не привязывает выбранное значение при заполнении из массива Observable

У меня есть реактивная форма angular2, которая содержит md-select, чтобы пользователь выбрал доктора из firebase. md-select работает нормально, когда данные существуют до рендеринга компонента, но если данные поступают асинхронно как наблюдаемые, он не показывает выбранное значение

 doctors$:Observable< Doctor[] > = this.doctorService.findAllDoctors();
 

  constructor(private fb:FormBuilder , public doctorService : DoctorService 
  ,private cdr: ChangeDetectorRef )

  {    
   
 this.doctors$= this.doctorService.findAllDoctors();
  
this.form = this.fb.group({
      FullName: ['',Validators.required],
      Ext: [''],
      BirthDate: ['',Validators.required],
      Gender: ['',Validators.required],
      Phone: ['',[Validators.required]],
      doctorId: ['']

    }); 
 
<md-select formControlName="doctorId" ngControl="doctorId"  placeholder="Doctor"  >
      <md-option *ngFor="let p of doctors$ | async  " [value]="p.value">{{p.value}}</md-option>

    </md-select>

введите код сюда


angular observable angularfire2 reactive-forms md-select
person Mohammed Salah    schedule 05.02.2017    source источник
comment
Вам необходимо подписаться на данные. Обновите код услуги врача на свой пост. ** Обратите внимание, что переменная вашего врача является наблюдаемой**   -  person Aravind    schedule 05.02.2017
comment
Я подписался на данные, и он получает список врачей, но, к сожалению, после создания группы форм, поэтому, когда врач привязан к md-select, он не находит в нем параметры, поэтому оставляет его пустым, когда я помещаю параметры в конструктор, например var doctor= [{ Имя:Ахмед}, {Имя:Джек}] это работает! Проблема в том, что данные поступают в последнее время после привязки группы форм. Есть ли способ создать группу форм после подписки на данные? заранее спасибо   -  person Mohammed Salah    schedule 06.02.2017

Ответы (1)


arrow_upward
0
arrow_downward

Решено путем обновления md-select выбранным значением после асинхронной загрузки данных параметров

 ngOnInit() {
   
this.doctors$.subscribe(c=>{

    this.form.controls['doctorId'].patchValue(this.initialValue.doctorId);


});

person Mohammed Salah    schedule 06.02.2017