Ionic - AngularJS: ion-toggle не обновляет модель

Question

У меня странная проблема с директивой ion-toggle в ионной структуре.

При использовании ион-тумблер, как это:

<ion-toggle ng-model="testToggle">Test toggle</ion-toggle> 

JS:

$scope.$watch('testToggle',function(value) { 
    console.log('testToggle changed to '+value); 
}) 

Контроллер не получает никакого обновления вообще.

Вот CodePen: http://codepen.io/anon/pen/jPOMqz

Вы увидите, что я добавил в $ интервал, который изменяет переплетены переменную случайным образом для того, чтобы видеть, что все остальное работает, как ожидалось

Спасибо очень much :)

Answer 1

Я использовал ng-change, чтобы обнаружить изменение; и я изменяю функцию toggleChange(). Так что ваш ion-toggle будет выглядеть следующим образом:

<ion-toggle ng-model="value" ng-change="toggleChange()">Test toggle</ion-toggle> 

И ваш контроллер изменит $scope.value и, следовательно, вы получите значение тумблер от $scope.value:

.controller('ContactCtrl', function($scope, $interval) { 
      $scope.value = false; 
      console.log('ContactCtrl started'); 

      $scope.toggleChange = function() { 
       if ($scope.value == false) { 
        $scope.value = true; 
       } else 
        $scope.value = false; 
       console.log('testToggle changed to ' + $scope.value); 
      }; 
     } 

Вот Codepen за то же самое: http://codepen.io/keval5531/pen/LVYROp

Answer 2

Ответ от Keval не сработал для меня, потому что он сбросил значение модели, которая переводит кнопку переключения в исходное положение. Поэтому правильным ответом будет создание переключателя, как показано ниже.

<ion-toggle ng-model=value ng-change="toggleChange()">Test toggle</ion-toggle>

А затем записать контроллер следующим образом.

.controller('ContactCtrl', function($scope, $interval) { 
     $scope.value = false; 

     $scope.toggleChange = function() { 
      console.log('testToggle changed to ' + $scope.value); 
     }; 
    }