Ionic 2,Xcode和JSON:无法显示JSON数据

时间:2017-06-09 10:37:14

标签: json xcode typescript ionic-framework

我成功地从嵌入到项目中的JSON文件中提取JSON数据,并在我的机器上使用“离子服务”时查看数据。 (这在我的Mac上使用离子服务本地工作) 在XCode中构建IOS之后我遇到了问题。 我将生成的项目导入XCode(正如我过去成功完成的那样),但在XCode中运行或在我的iPhone上运行时,JSON不再可见。

我正在运行所有内容的最新版本并在mac上工作。

有人可以告诉我我可能做错了什么或我错过了什么?

再次感谢您的帮助!!!

我在下面列出了我的代码片段:

**src/assets/data/kjv.json**
JSON file location

**src/providers/my-data/my-data.ts:**
import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';

@Injectable()
export class MyData {

    constructor(public http: Http) {
    }

    getLocalData(){
        return this.http.get('../../assets/data/kjv.json');
    }

}

**src/pages/home/home.ts:**
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { MyData } from '../../providers/my-data/my-data';
import { ChaptersPage } from '../chapters/chapters';

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

export class HomePage {

    items: any;

    constructor(public navCtrl: NavController, public myService: MyData) {
    }

    ionViewDidLoad(){
        this.myService.getLocalData().map(res => res.json()).subscribe(data         => {
        this.items = data;
        });
    }

    nextPage(bookNo){
        localStorage.setItem('bookNumber', bookNo);
        this.navCtrl.push(ChaptersPage);
    }

}

**src/app/app.module.ts:**
import { NgModule, ErrorHandler } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { HttpModule } from '@angular/http';
import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular';
import { MyApp } from './app.component';

import { AboutPage } from '../pages/about/about';
import { ContactPage } from '../pages/contact/contact';
import { HomePage } from '../pages/home/home';
import { ChaptersPage } from '../pages/chapters/chapters';
import { VersesPage } from '../pages/verses/verses';
import { TabsPage } from '../pages/tabs/tabs';

import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';
import { MyData } from '../providers/my-data/my-data';

    @NgModule({
        declarations: [
        MyApp,
        AboutPage,
        ContactPage,
        HomePage,
        ChaptersPage,
        VersesPage,
        TabsPage
        ],
        imports: [
        BrowserModule,
        IonicModule.forRoot(MyApp),
        HttpModule
        ],
        bootstrap: [IonicApp],
        entryComponents: [
        MyApp,
        AboutPage,
        ContactPage,
        HomePage,
        ChaptersPage,
        VersesPage,
        TabsPage
        ],
        providers: [
        StatusBar,
        SplashScreen,
        {provide: ErrorHandler, useClass: IonicErrorHandler},
        MyData
        ]
    })
export class AppModule {}

1 个答案:

答案 0 :(得分:0)

问题是指向JSON文件的位置。 这解决了我的问题:

this.http.get( '../../资产/数据/ kjv.json');

更改为,

this.http.get( '资产/数据/ kjv.json');

感谢来自离子论坛的坚果糖......