如何在离子中读取本地文件json？

Question

帮助我需要阅读应用程序与离子json文件，我开始在这个主题，我不知道如何做到这一点。

好了，所以在这个类是在这种情况下，我把数据从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路径

Answer 1

嗨，你可以使用本地文件插件来读取文件在您的设备

Native File Plugin

Answer 2

要读取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()); 
    }