2017-10-19 17 views
0

In meinem ionischen Projekt verwendete ich eine API, um Flugdetails zu erhalten. In dieser API hat es ein Objekt mit dem Namen "airportResources" und hat 4 Werte (departureTerminal, arrivalTerminal, departureGate, arrivalGate). Aber manchmal ist das Objekt in api nicht verfügbar, oder alle Werte sind nicht verfügbar (das heißt, manchmal enthält es nur departureTerminal oder arrivalTerminal oder zwei oder drei Werte). Mein Problem ist, wenn ich versuche, diesen Wert anzuzeigen, zeigt es Fehler. Wie kann ich mit diesem Problem umgehen? Screenshot der Reaktion unten enthalten (in diesem Bild die airportResources Objekt hat nur 2 Werte) enter image description hereUmgang mit API-Daten

ts-Code:

enter code here 

get_arrivalflights() {

var communicationParams = { 
    showLoader: true, 
    reqUrl: "", 
    reqBody: {}, 
    callBackSuccess: (response) => { 
    console.log(response); 
    this.objectData = response.flightStatuses; 

    }, 
    callBackFailure: (response) => { console.log("failure dude"); console.log(response); } 
}; 
this.restservice.makeGetRequest(communicationParams); 

}

Html:

<div class="col" style="font-size: 18px;text-align: center">{{item.airportResources.departureTerminal}}</div> 

Api Berufung Anbieter:

makeGetRequest(communicationParams: any) { 

    this.baseUrl = " the url i want to call "; 


    var loader; 
    if (communicationParams.showLoader == true) { 
     loader = this.loadingController.create({ 
     content: "" 
     }); 
     loader.present(); 
    } 
    this.http.get(this.baseUrl + communicationParams.reqUrl) 
     .map(response => response.json()) 
     .subscribe(communicationParams.callBackSuccess, function(respone) { 
      if (communicationParams.showLoader == true) { 
      loader.dismiss() 
      } 
      communicationParams.callBackFailure(respone); 
     }, 
     () => { 
      console.log('Authentication Complete'); 
      if (communicationParams.showLoader == true) { 
      loader.dismiss() 
      } 
     }); 
    } 

der Fehler msg: (?) enter image description here

Antwort

0

in Ihrem HTML, warten die aysnc Operator verwenden, um anzuzeigen, und das optionale Argument nicht bekommen ein Fehler in der Struktur, wenn Daten nicht da sind.

{{ (item | async)?.airportResources.departureTerminal }}