Значение ng-model переключается с false на undefined вместо true при установке флажка

Я борюсь с флажком ввода и ng-моделью. Я инициализирую свою переменную значением false, устанавливая ее как ng-модель для флажка ввода. При его отображении значение равно false. После нажатия на флажок значение меняется на неопределенное вместо истинного.

Вот мой код:

<div ng-app="app" ng-controller="Controller">
    <input id="check" type="checkbox" ng-model="model.noExpiry" ng-click="model.clickCheck()">Click
    <p>{{model.noExpiry}}</p>
</div>


var module = angular.module("app",[]);

    module.controller("Controller", function ($scope) {
      $scope.model = {};
      $scope.model.noExpiry = false; 

      $scope.model.clickCheck = function(){
        console.log($scope.model.noExpiry);
      }
});

Если я удалю ng-модель и изменю функцию model.clickCheck на следующую, она правильно изменит переменную с false на true и наоборот:

$scope.model.clickCheck = function(){

    if($scope.model.noExpiry) {
        $scope.model.noExpiry = false;
    }
    else {
        $scope.model.noExpiry = true;
    }

    console.log($scope.model.noExpiry);
}

Когда я инициализирую model.noExpiry значением true, флажок оказывается отмеченным, но при снятии и повторной проверке он меняется на false, а затем снова на undefined.

Кто-нибудь знает, почему переменная не меняется на истину, а вместо этого становится неопределенной?

Версия AngularJs: 1.5.5


javascript angularjs angular-ngmodel angularjs-ng-model
person Lea    schedule 05.04.2018    source источник
comment
Вы инициализируете свою модель где-нибудь? $scope.model = {};   -  person Aleksey Solovey    schedule 05.04.2018
comment
@AlekseySolovey да, извините, просто забыл написать   -  person Lea    schedule 05.04.2018
comment
тогда вы не должны получать undefined, есть опечатка или что-то в этом роде, но вашего кода недостаточно для воспроизведения проблемы   -  person Aleksey Solovey    schedule 05.04.2018
comment
но если это так, то почему оно всегда корректно меняется на ложное, но никогда на истинное? и почему это работает при использовании обходного пути с установкой переменной через функцию ng-click?   -  person Lea    schedule 05.04.2018

Ответы (1)


arrow_upward
0
arrow_downward

Причина в том, что $scope.model не определено. Итак, свойство $scope.model.noExpiry недействительно. Просто добавил $scope.model = {}; в свой контроллер, чтобы сделать действительный объект.

Пожалуйста, проверьте окончательный обновленный код:

var module = angular.module("app",[]);
    
    
    module.controller("Controller", function ($scope) {
      $scope.model = {};
      $scope.model.noExpiry = false;

      $scope.model.clickCheck = function(){
        console.log($scope.model.noExpiry);
      }
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="Controller">
    <input id="check" type="checkbox" ng-model="model.noExpiry" ng-click="model.clickCheck()">Click
    <p>{{model.noExpiry}}</p>
</div>

person I. Ahmed    schedule 05.04.2018
comment
я правильно понимаю, что вы только что добавили $scope.model = {};? я просто забыл написать... у меня не работает - person Lea; 05.04.2018
comment
Добавлен уже работающий фрагмент кода, и он работает во фрагменте. вы проверили фрагмент - person I. Ahmed; 05.04.2018
comment
Используете ли вы код: if($scope.model.noExpiry) { $scope.model.noExpiry = false; } еще { $scope.model.noExpiry = true; } - person I. Ahmed; 05.04.2018
comment
Потому что ваша ng-модель для флажка сделает это за вас. Ваше вышеуказанное условие может создать проблему. - person I. Ahmed; 05.04.2018
comment
я использую его как обходной путь. если я использую только ng-модель с инициализацией модели и model.noExpiry=false, это не сработает - person Lea; 05.04.2018
comment
@Lea, ты имеешь в виду angularjs 1.4? или угловой 2.4? они совершенно разные - person Aleksey Solovey; 05.04.2018
comment
@AlekseySolovey надо исправиться...версия 1.5.5 - person Lea; 05.04.2018