APIからのデータにアクセスできません

Question

イオンと角度が新しいです。 APIからデータを取得したいのですが、データにアクセスできません。

は、ここに私のコード

public items: any; 

    constructor(
    public navCtrl: NavController, 
    public modalCtrl: ModalController, 
    public navParams: NavParams, 
    public http: Http) { 

    let headersToken = new Headers(); 
    headersToken.append('Authorization', 'Bearer token here'); 

    this.http.get('http://localhost:8000/api/data',{headers : headersToken}).map(res => res.json()).subscribe(data => { 
      this.items = data; 
     }); 

    }  

    ionViewDidLoad(){ 
    console.log(this.items); 
    } 

そしてIonViewDidLoadの結果は未定義です。

Answer 1

IonViewDiDLoadが呼び出されたときにHTTP呼び出しが終了している可能性があります。タイムアウトを設定して、動作するかどうか確認してください。

注：によりあなたは、以下のようにそれを行う必要がありasync自然にそうでなければ、それはあなたのHTTPリクエストは、あなたがこのようにそれを行うことができ、適切なデータ

Answer 2

を返していない可能性があります。

ionViewDidLoad(){ 
    let headersToken = new Headers(); 
    headersToken.append('Authorization', 'Bearer token here'); 

    this.http.get('http://localhost:8000/api/data',{headers : headersToken}).map(res => res.json()).subscribe(data => { 
      this.items = data; 
      console.log(this.items); 
     }); 

    } 

Answer 3

なぜこれが起こっているのかを理解する必要があります。

Http.getは、非同期コールです。

httpコールからの出力を受け取る前、またはコールが完了する前に、コードを書いた方法が実行されています。console.log(this.items);が実行されています。

コール後にデータを取得するには、consoleをsubscribe内に配置する必要があります。私は内部のconsole.log(this.items)の下に追加されている

は、私はこのことができます願ってい

 this.http.get('http://localhost:8000/api/data',{headers : headersToken}) 
.map(res => res.json()) 
.subscribe(data => this.items = data, // 1st param where you get data 
      (error) => console.log(error), // error if any 
      () => conosle.log("call is finished"+this.items) // call is completed. here you call ionViewDidLoad() as well. 
      ); 

     }  

     ionViewDidLoad(){ 
     console.log(this.items); 
     } 

をサブスクライブします。