2017-09-25 24 views
0

助けてください私はイオン性のアプリでjsonファイルを読む必要があります。私はこのテーマで始まりました。私はこれをどうやって行うのか分かりません。jsonのローカルファイルを読み込むにはどうすればいいですか?

[OK]を、このクラスでは、私は別のクラスでhttps://randomuser.me

import { Injectable } from '@angular/core'; 
import { Http } from '@angular/http'; 
import 'rxjs/add/operator/map'; 
import 'rxjs/add/operator/toPromise'; 

@Injectable() 
export class SoilsServeProvider { 

constructor(public http: Http) { 

} 
getUsers() { 
return this.http.get('https://randomuser.me/api/?results=15') 
.map(res => res.json()) 
.toPromise(); 
} 

} 

からデータを置くこの場合、プロバイダであるので、私は、ビュー

専用コントローラ

ついに
import { Component } from '@angular/core'; 
import { IonicPage, NavController, NavParams } from 'ionic-angular'; 
import { SoilsServeProvider } from '../../providers/soils-serve/soils- 
serve'; 


@IonicPage() 
@Component({ 
selector: 'page-cultivos', 
templateUrl: 'cultivos.html', 
}) 
export class CultivosPage { 
users: any[] = []; 
constructor(public navCtrl: NavController, public navParams: NavParams, 
public userService: SoilsServeProvider) { 
} 

ionViewDidLoad(){ 
this.userService.getUsers() 
.then(data => { 
    this.users = data.results; 
}) 
.catch(error =>{ 
    console.error(error); 
}) 
} 
} 

で、これを置きます

<ion-header> 
<ion-navbar color="primary"> 
<ion-title> 
    Demo 10 
</ion-title> 
</ion-navbar> 
</ion-header> 

<ion-content> 
<ion-list> 
<ion-item *ngFor="let user of users"> 
    <ion-avatar item-start> 
    <img [src]="user.picture.medium"> 
    </ion-avatar> 
    <h2>{{ user.name.first | uppercase }}</h2> 
    <p>{{ user.email }}</p> 
</ion-item> 
</ion-list> 
</ion-content> 

この結果は

result

この例で、それは大丈夫だが、私は地元のJSONからデータを読みたい、例えばパスそれのアプリ/資産/ data.json

答えて

0

こんにちは、あなたはファイルを読むためにネイティブファイルのプラグインを使用することができますお使いのデバイスで

Native File Plugin

0

JSONファイルを読み取ります。 JSONファイルをsrc/assetsに配置しました。

Write This function 
try { 
     this.services.getJSon().subscribe(result => { 
     this.questionList = result.examList; 
     console.log(this.questionList); 
     }); 
    } catch (e) { 
     console.log("Profile" + e); 
    } 

This function within Services 

getJSon() :any{ 
    return this.http.get('assets/data/test.json').map(res => res.json()); 
    } 
関連する問題