Ng-checked does not show correct state with ion-toggle

#1

Hi,

I’m using the ion-toggle directive as follows:

<ion-toggle ng-repeat="item in settings" ng-checked="item.checked"
            ng-model="item.checked" ng-click="updateSettings(item)">
    {{ item.text }}
</ion-toggle>

The controller code is as follows:

$scope.settings = [];

// getting saved settings from sqlite db
$ionicPlatform.ready(function () {
    Settings.all().then(function (settings) {
        $scope.settings = settings;
        $cordovaToast.showLongBottom("Settings retrieved : " + JSON.stringify(settings));
    });
});    

$scope.updateSettings = function (item) {
        //angular.forEach($scope.settings, function (setting) {
            $cordovaToast.showLongCenter("Updating with "+item.text+" , "+ item.checked);
            Settings.update(item.text, item.checked)
                .then(function (result) {
                    $cordovaToast.showLongBottom("Update successful : " + JSON.stringify(result));
                    Settings.all().then(function(records){
                        $cordovaToast.showLongCenter(JSON.stringify(records));
                    });
                })
                .catch(function(err){
                    $cordovaToast.showLongBottom("Update Error : " + JSON.stringify(err));
                });
        //});
    }

The directive doesn’t show the correct state when the app starts, despite the data being retrieved correctly from the database. It always shows checked. Could anyone point me to the mistake I’m making?

Thank you!

#2

did you see this in StackOverflow? Looks like you are running into a similar issue http://stackoverflow.com/questions/16601018/angularjs-ng-model-not-binding-to-ng-checked-for-checkboxes

#3

Thank you for pointing me to that thread. However, I had tried using only ng-model earlier. In that case it is always unchecked irrespective of the boolean value.