Ionic3：JSON到數組

我想一個JSON從laravel API轉換成陣列上離子3Ionic3：JSON到數組

這裏是我的JSON：

Object {id_oiseau: 1, 
    nom_commun: "Hirondelle", 
    lieu_signalement: "Foret", 
    date_signalement: "2017-05-16", 
    condition_signalement: "Aile coincee sous branche"…} 
    condition_signalement:"Aile coincee sous branche" 
    date_reception:"2017-05-16" 
    date_renvoi:"2017-05-02" 
    date_signalement:"2017-05-16" 
    descriptif_etat:"Aile cassee" 
    etat_actuel:"En attente de livraison" 
    id_acteur:1 
    id_adherent_lpo:1 
    id_local_lpo:1 
    id_oiseau:1 
    id_oiseau_dico:1 
    id_statut_oiseau:1 
    image:"bird-profil.jpg" 
    immatriculation:"EZ654ERRZ" 
    lieu_signalement:"Foret" 
    nom_codifie:"HIRON-NANT-4949845" 
    nom_commun:"Hirondelle" 
    pays:"France"

這裏提供商爲我的Ionic應用程序接收JSON：

export class BirdService { 

    returnedData; 
    headers: any; 
    options: any; 

    constructor(public http: Http) { 
     this.headers = new Headers(); 
     this.headers.append('Content-Type', 'application/json'); 
    } 

    getRemoteData(): Observable<any> { 
     return this.http.get('http://extranet.local/api/v1/bird/1', this.headers).map(res => res.json()); 
    } 
}

這裏是將JSON轉換爲函數：

export class HistoryPage { 

    constructor(public navCtrl: NavController, public serviceOne: BirdService) {} 

    ionViewDidLoad() { 

     this.serviceOne.getRemoteData().subscribe(
      data => { 
       let list: History[] = data; 
       console.log(data); 
     }); 
    } 
}

它不起作用，因爲JSON文件留在JSON 「對象{..：.. ..：..}」

我試着用parseJSON與jQuery，但我不得不「無法讀取屬性未定義「parseJSON」」

import { jQuery } from 'jquery'; 

@Component({ 
    selector: 'page-History', 
    templateUrl: 'History.html' 
}) 

export class HistoryPage { 

    constructor(public navCtrl: NavController, public serviceOne: BirdService) {} 

    ionViewDidLoad() { 

     this.serviceOne.getRemoteData().subscribe(
      data => { 
       var History = jQuery.parseJSON(data); 
       console.log(History); 
     }); 
    } 
}

而且我用角與fromJson但離子找不到名稱爲‘角’

import { Component } from '@angular/core'; 
import { NavController } from 'ionic-angular'; 
import { jQuery } from 'jquery'; 


@Component({ 
    selector: 'page-History', 
    templateUrl: 'History.html' 
}) 

export class HistoryPage { 

    constructor(public navCtrl: NavController, public serviceOne: BirdService) {} 

    ionViewDidLoad() { 

     this.serviceOne.getRemoteData().subscribe(
      data => { 
       var History = angular.fromJson(data); 
       console.log(History); 
     }); 
    } 
}

感謝您的幫助！

來源

2017-06-15 TuxxyDOS

'console.log（data）'的輸出是什麼？ –

我剛剛使用輸出 – TuxxyDOS

進行了編輯，您可以添加文本而不是圖片嗎？ –

使用JSON.parse()方法。

您不需要導入任何其他庫進行解析。

您的代碼應該如下：

ionViewDidLoad() { 

     this.serviceOne.getRemoteData().subscribe(
      data => { 
       var History = JSON.parse(data); 
       console.log(History); 
     }); 
    }

來源

2017-06-15 11:29:07

感謝您的迴應，但有一個錯誤：位置1 JSON的意外令牌o – TuxxyDOS

這意味着您的JSON是無效。請確保您的JSON有效。然後只有解析函數可以工作。 –

我在我的帖子中添加了JSON，我認爲我的JSON沒問題 – TuxxyDOS

您不必解析JSON在subscribe。 這是因爲你在map函數中這樣做。map(res => res.json())

  let list: History[] = data;

這不是工作，因爲你的數據是一個對象，而不是這裏的數組。

只要做到：

 var history = data;

可以從對象獲取的內容，像這樣：

console.log(history.nom_commun);

來源

2017-06-15 13:17:57

好的，我可以用這種方式在另一個頁面中使用我的數據，如下所示：* ngFor =「let h of History; let i = index」

{ {h.nom_commun}}

？ – TuxxyDOS

你沒有得到一個數組..但一個單一的對象不會在for循環..如果你期待一個數組可能檢查服務器端.. –

再次感謝，但我發現另一種方式，

我做了

History.push(data);

所以這是一個對象在一個數組中，我的系統使用角度來使用數據似乎很適合這個。

來源

2017-06-15 13:56:06 TuxxyDOS

Ionic3：JSON到數組

回答

相關問題