I have local json data which I have subscribed to a property ‘jobs’. I am passing this property to other page using NavParams. On the other page I am receiving using get method of navparams. I am not able to assign this data to any property on other page. I want to display this data in html of other page. How do i do that?
This is my home page
import { Component } from ‘@angular/core’;
import { NavController } from ‘ionic-angular’;
import {ColorProvider} from '…/…/providers/color/color’
import { InfoPage } from ‘…/info/info’;
import { identifierModuleUrl } from ‘@angular/compiler’;
@Component({
selector: ‘page-home’,
templateUrl: ‘home.html’
})
export class HomePage {
public jobs: any;
constructor(public navCtrl: NavController,public ColorPr: ColorProvider) {
}
ionViewDidLoad() {
this.ColorPr.getLocalData().subscribe(data => {
this.jobs = data;
console.log(this.jobs);
});
}
itemSelected(name){
this.navCtrl.push(‘InfoPage’,{jobs:name});
}
}
Home html
Names
{{job.name}}
Other Page
@IonicPage()
@Component({
selector: ‘page-info’,
templateUrl: ‘info.html’,
})
export class InfoPage {
public jobinfo: any;
constructor(public navCtrl: NavController, public navParams: NavParams, public alertCtrl: AlertController) {
this.jobinfo = console.log(navParams.get(‘jobs’));
console.log(this.jobinfo);
}
ionViewDidLoad() {
console.log(‘ionViewDidLoad InfoPage’);
}
}
Other page html
{{jobinfo}}
</ion-item>
Provider
import { HttpClient } from ‘@angular/common/http’;
import { Injectable } from ‘@angular/core’;
import {Http} from ‘@angular/http’;
import ‘rxjs/add/operator/map’;
@Injectable()
export class ColorProvider {
constructor(public http: Http) {
console.log(‘Hello ColorProvider Provider’);
}
getLocalData() {
return this.http.get(’…/…/assets/data/adver.json’).map(res => res.json());
}
}