Navparams.get(...) is undefined even though everything is valid

Ionic Framework ionic-v3
1

Hai guys, got fed up with this one problem were i am getting this.navparams.get() is undefined.

What i am doing is that

  1. there is this home page. i am going to the settings page and doing some work in the settings page and returning back to the home page after a button click
  2. i return back into the home page and validate the data i receive from settings page through navparms and show it in the home component.html

this is my home component.ts file

import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import { Storage } from '@ionic/storage';

import { SettingsPage } from '../settings/settings';
import { AuthServiceProvider } from '../../providers/auth-service/auth-service';

@Component({
	selector: 'page-home',
	templateUrl: 'home.html'
})
export class HomePage {
	token: string;
	unit: any;
	dorf: string;
	jsonObj: object = {};

	

	constructor(private authService: AuthServiceProvider, private storage: Storage, public navParams: NavParams, public navCtrl: NavController) {
		if (this.navParams.get('valid')) {
			this.token = this.navParams.get('token');
			this.unit = this.navParams.get('unit');
			this.jsonObj["color"] = this.navParams.get('color');
			this.jsonObj["humidity"] = this.navParams.get('latestReading').humidity;
			this.jsonObj["roomTemp"] = this.navParams.get('latestReading').roomTemperature;
			this.jsonObj["tcTemp"] = this.navParams.get('latestReading').thermocoupleTemperature;
			this.jsonObj["tcVariationMax"] = this.navParams.get('thermocoupleVariation').max;
			this.jsonObj["tcVariationMin"] = this.navParams.get('thermocoupleVariation').min;
			this.jsonObj["token"] = this.navParams.get('token');
			this.jsonObj["unit"] = this.navParams.get('unit');
			this.jsonObj["loggedTime"] = this.navParams.get('latestReading').loggedTime;
			if (this.jsonObj["unit"] === "1") {
				this.dorf = 'C';
			} else if (this.jsonObj["unit"] === "2") {
				this.dorf = 'F';
				this.convertCelcius();
			}
			this.storage.set('deviceData', JSON.stringify(this.jsonObj));
		}

		if (this.navParams.get('tracker')) {
			
			this.token = this.navParams.get('token');
			this.refresh(this.token);
		}
	}

	

	public settings() {
		this.navCtrl.push(SettingsPage, { deg: this.dorf, token: this.token, unit: this.unit });
	}

	ionViewDidLoad() {
		console.log('refresh from ionviewdidload')
		//setInterval(() => this.refresh(this.token), 10000);
	}

	public convertCelcius() {
		this.jsonObj["roomTemp"] = this.jsonObj["roomTemp"] * 9 / 5 + 32;
		this.jsonObj["tcTemp"] = this.jsonObj["tcTemp"] * 9 / 5 + 32;
		this.jsonObj["tcVariationMax"] = this.jsonObj["tcVariationMax"] * 9 / 5 + 32;
		this.jsonObj["tcVariationMin"] = this.jsonObj["tcVariationMin"] * 9 / 5 + 32;
		return;
	}

	public refresh(token): any {
		this.authService.refresh(token).subscribe(value => {
			if (value.valid === 1) {
				this.token = value.token;
				this.jsonObj["color"] = value.color;
				this.jsonObj["humidity"] = value.latestReading.humidity;
				this.jsonObj["roomTemp"] = value.latestReading.roomTemperature;
				this.jsonObj["tcTemp"] = value.latestReading.thermocoupleTemperature;
				this.jsonObj["tcVariationMax"] = value.thermocoupleVariation.max;
				this.jsonObj["tcVariationMin"] = value.thermocoupleVariation.min;
				this.jsonObj["token"] = value.token;
				this.jsonObj["unit"] = value.unit;
				this.jsonObj["loggedTime"] = this.navParams.get('latestReading').loggedTime;
				this.unit = value.unit;
				this.storage.set('deviceData', JSON.stringify(this.jsonObj));
				if (this.jsonObj["unit"] === "1") {
					this.dorf = 'C';
				} else if (this.jsonObj["unit"] === "2") {
					this.dorf = 'F';
					this.convertCelcius();
				}
				
			}
		}, (error) => {
			console.log(error);
		});
	}

}

and here is my settings.ts page

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
//import {Navbar} from 'ionic-angular';
import { HomePage } from '../home/home';

import { AuthServiceProvider } from '../../providers/auth-service/auth-service';
import { FailServiceProvider } from '../../providers/fail-service/fail-service';

@IonicPage()
@Component({
	selector: 'page-settings',
	templateUrl: 'settings.html'
})
export class SettingsPage {
	settingValue = {
		token: '',
		unit: '',
		thresholdLow: '',
		thresholdMedium: '',
		thresholdHigh: '',
		alarmDuration: '',
		alarmStatus: ''
	}

	degree: string;

	constructor(private failService: FailServiceProvider, public navCtrl: NavController, public navParams: NavParams, private authService: AuthServiceProvider) {
		this.degree = this.navParams.get('deg');
		this.settingValue.token = this.navParams.get('token');
		this.settingValue.unit = this.navParams.get('unit');
		
	}

	
	ionViewDidEnter() {
		this.authService.settingsPopulate(this.settingValue.token).subscribe(value => {
			if (value.valid === 1) {
				//console.log(value); contains unit,userId,id
				console.log(value);
				this.settingValue.thresholdLow = value.settings.thresholdLow;
				this.settingValue.thresholdMedium = value.settings.thresholdMedium;
				this.settingValue.thresholdHigh = value.settings.thresholdHigh;
				this.settingValue.alarmDuration = value.settings.alarmDuration;
				this.settingValue.alarmStatus = value.settings.alarmStatus;
			}
		});
	}

	

	public hushAlarm() {
		
			this.authService.hushAlarm(this.settingValue).subscribe(value => {
				if (value.valid === 1) {
					this.navCtrl.setRoot(HomePage, {
						token: value.token,
						tracker: true
					});
				}
			});
		
	}

}

can anyone help me please… i am really frustrated on this issue. it was working for some time and now it got suddenly stopped

this is my error

columnNumber: 47
fileName: "http://localhost:8100/build/main.js"
lineNumber: 921
message: "_this.navParams.get(...) is undefined"