Passing data from one page to other page

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’;
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 => { = data;




Home html



Other Page
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’));
ionViewDidLoad() {
console.log(‘ionViewDidLoad InfoPage’);



Other page html

info This is info page



import { HttpClient } from ‘@angular/common/http’;
import { Injectable } from ‘@angular/core’;
import {Http} from ‘@angular/http’;
import ‘rxjs/add/operator/map’;

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());