Angular всегда нажимает на URL REST API со второй попытки

Question

Мое приложение имеет угловой js-интерфейс и Django Rest API, работающий в бэкэнде.Я отправляю запрос в API следующим образом:

  public getData(section) {
        console.log("I am here getVAM");
        return this.http.get('http://localhost:8000/vamcomponent/'+section+'/')
            .map((response: Response) => {
             console.log("I am here getVAM2");
             return response.json()
            });
    }

Я читаю данные, полученные этим приложением, вот так

 public getVamData(id,section): Observable<any> {

        this.getData(section).takeWhile(users => users.length > 0).subscribe(result =>{ 
        this.d=result;     
}, error => console.log(error));   
        console.log(this.d);
        for(var i=0;i<this.d[1].classes.length;i++){
                console.log(this.d[1].classes[i])
                return this.d[1].classes[i];

        }
      }
  }

Проблема в том, что я получаю данные только для подпискиво второй раз.Он появляется как undefined в первой попытке, и я получаю данные из REST API только во второй попытке.Таким образом, во внешнем интерфейсе, только если я дважды щелкну по строке, я смогу показать данные

Но когда я нажимаю REST API извне приложения, явозможность извлечения данных во всех попытках.Я использовал takeWhile () в подписке, чтобы убедиться, что только если я получу данные из REST API, я перейду к следующему шагу использования данных для их отображения в приложении.