Angular 4 FormArray z opóźnieniem w http Observable Service [duplicate] - angleular, rxjs, obserwable

Muszę wyświetlić i edytować listę zwróconych przedmiotówprzez usługę http w Angular 4 Reactive form. Ponieważ mam nieokreśloną listę, potrzebuję FormArray. ale moim problemem jest moja usługa http, która zwraca obserwowalny nie dostarcza danych, gdy łatam tablicę. Tak więc, gdy przechodzę przez zwrócony zestaw danych, generuje błąd "Nie można odczytać właściwości x nieokreślonego". Jestem nowy w Observable, więc nie mogłem znaleźć rozwiązania. Czy mógłbyś pomóc?

usługa:

getCountries() : Observable<Country[]>{
console.log("In getCountries");
return this.http
.get(this.apiUrl)
.map(response => <Country[]>response.json());
}

Składnik:

ngOnInit(){
this.getCountries();
this.initForm();
this.patchForm();
}

getCountries(){
this.countryService.getCountries()
.subscribe( response => {
this.countries = response;
console.log("response");
console.log(response);
},
error => {
console.log("error");
console.log(error);
});
console.log("this.countries");
console.log(this.countries);
}

patchForm(){
const control = <FormArray>this.countryForm.controls.countries;
console.log("in patchForm()");
console.log(this.countries);
this.countries.forEach(element => {
control.push(this.formBuilder.group({
id: element.id,
name: element.name,
deleted: element.deleted
}));
});
}

odpowiedź getCountries () jest wyświetlana na konsoli przeglądarki na końcu. Wygląda na to, że brakuje mi tutaj asynchronicznej koncepcji.

Odpowiedzi:

Musisz się ruszać patchForm wnętrze success oddzwanianie twojego Observable

ngOnInit(){
this.initForm();
this.getCountries();
}

getCountries(){
this.countryService.getCountries()
.subscribe( response => {
this.countries = response;
this.patchForm();
console.log("response");
console.log(response);
},
error => {
console.log("error");
console.log(error);
});
console.log("this.countries");
console.log(this.countries);
}