Range slider not updating when used after navigating to page via local notification

I am trying to prompt a diary entry via local notification where the user has to rate their mood via slider. For some reason when using the range slider it does not seem to live update, and I have to turn the screen off on my phone and back on again in order to make the slider move to where it has been moved to.

This only seems to be an issue when going to the page after clicking on a notification because on pressing a button to go to the page, the range slider moves to wherever my finger is at the time.

overview.ts

Here is the two ways I am navigating to the entry page.

`LocalNotifications.on(“click”, (notification, state) => {
this.navCtrl.push(EntryPage);
});

test() {
this.navCtrl.push(EntryPage);
}`

entry.ts

`export class EntryPage {

ratings = {
angry: 5,

}

changed() {
console.log("Ratings: " + this.ratings.angry);

}`

I am using changed() to monitor changes to make sure the value is actually changing.

entry.html

<ion-list> ... <ion-item> <ion-label>Anger</ion-label> <ion-range min="0" max="10" [(ngModel)]="ratings.angry" (ionChange)="changed()"> <ion-label range-left>-</ion-label> <ion-label range-right>+</ion-label> </ion-range> </ion-item> </ion-list>

The “…” is just to remove irrelevant code from creating clutter.

Have I gone wrong somewhere?