Onsen Switch Not Remembering it's State (and Not Calling Function on Switch Checked)? - onsen-ui

Question

I have an Onsen-UI Switch. I switch it on, then navigate away from the page. When I return to the page, the switch has changed to off; the switch has not remembered it's state?
I am also having trouble coding the Switch so it calls a function on Switch changed.
I've read the Onsen Docs and searched online, but I cannot find a clearly coded example to achieve the above.
<label class="switch">
<input type="checkbox" var="switchName" ng-model="switchState" ng-change="switchChanged()" class="switch__input">
<div class="switch__toggle"></div>
</label>
Script
function switchChanged() {
if ($scope.switchState == true) {
// Switch to saving app data into Production Database
} else {
// Switch to saving app data into Developer Database
};
};
Thank you for any help.

Answer 1

ons-switch remembers its state as long as the page that contains it is not destroyed and created again. You can achieve that with pushPage in ons-navigator or with persistent tabs in ons-tabbar.
If you want to listen to ons-switch's change event:
document.addEventListener('change', function(event) {
console.log('Switch value is: ', event.target.checked);
});
You can see it working here: http://codepen.io/frankdiox/pen/JGYZvx
Hope it helps!

Answer 2

You need to store the state or value ng-nodal (maybe in database). then use that value to initialise your switch input.
INITIALISING FROM YOUR STORAGE
Controller
$scope.switchtoggle = value == 1;
$scope.switchTrigger = function (obj){
if(obj){
//Do something
} else {
//Do something else
}
}
in your HTML
<ons-switch ng-model="switchtoggle" ng-change="switchTrigger(switchtoggle)" ></ons-switch>