Ion Toggle w/ Localstorage

Well this is a weird one. I’m saving the boolean returned from a ion-toggle into local storage so that when the user clears the app and comes back, the toggle will still be turned on if they had it that way, and vice versa.

The issue is that even though the key in local storage notificationsValue stores the correct value, the toggle doesn’t bind to it when the page is refreshed.

I’ve created a pen illustrating the problem. To replicate, simple chose the toggle to be on, check local storage to make sure it says ‘true’ for notificationsValue and then refresh the page. You’ll notice the toggle will be off.

Why are you using the “this” object instead of angulars $scope?..

The main problem is, that the ion-toggle expects boolean values, but if you change the value you get strings like “true” or “false”.

So change your line to read the localstorage to that:

main.alertOn = window.localStorage.notificationsValue === 'true' ? true : false;

If you are using scope:

1 Like

I’m using the controllerAs syntax instead of $scope, that’s all.

Yep! That’s worked perfect. I actually tried to do that earlier, I must of using the ternary wrong.

Thanks for the hand man. Appreciate it.