[SOLVED] Ng-change, change scope variable, does not update UI

1

Hi

I have a toggle, which when set to “true” gives the user a confirm dialog.
If the user cancels, the UI toggle does not revert to false.
I’ve attempted to use $scope.apply(), but it says it is already applying.

HTML:

<ion-toggle ng-model="useMobileData"
            ng-change="updateMobileData(useMobileData)">
    <b>Use Mobile Data</b>
</ion-toggle>

Javascript:

$scope.useMobileData = false;
$scope.updateMobileData = function (bool) {
    if (bool) {
        bool = confirm("Using Mobile Data may incur a cost, depending on your tariff");
    }
    //$scope.$apply(function () {
    $scope.useMobileData = bool;
    //});

};

Any help is appreciated!

EDIT:
Added a Code Pen:

I assume this is due to ng-model.

2

I hate to bump, but I’m still having this problem.

I think the ng-model updates itself after the ng-change, therefore countering the change made to the scope variable.

3

try making ng-model as

$scope.useMobileData = {};
$scope.useMobileData.bool = false;

this is angular scoping problem with models. it is documented. google it and read. I also spent countless hours on this once in my app.

4

By Jove, you’ve done it.

Nesting the bool within a (otherwise unused) scope object worked.

You say it was well documented, I have done a lot of research on this and did not find it. Sorry if it appears I’ve been lazy…

Thank you.

5

check this https://www.youtube.com/watch?v=ZhfUv0spHCY&feature=youtu.be&t=30m

6

You star. Thanks.

No wonder I couldn’t search for it if it was in a “best practice” video…

Now I feel like “One Of Those” people… :slight_smile:

Thanks again.