Angular - ng-change checkbox doesn't fire for first time

Question

I want to fire ng-change whenever user change checkbox's status. Here is my code :

                    <div ng-class=" food.status == 1 ? 'text-success' : 'text-danger'" class="pull-left m-t-sm ">
                        <i class="fa fa-circle"></i>
                        <label class="md-switch">
                            --{{ food.status }}
                            **{{ food.enableFood }}
                            <input type="checkbox" ng-checked="food.enableFood"  ng-model="food.status" ng-change="changeFoodStatus(food.status , food.id)">
                            <i class="blue"></i>
                        </label>
                    </div>

And here is my Angular function :

$scope.changeFoodStatus = function (status , id) {
    console.log(status,id);
    var foodStatus = 1 ;
    if(!status) {
        foodStatus = 2;
    }
    console.log(foodStatus , id);
    var foodData = {
        foodStatus  : foodStatus,
        foodId      : id
    };



    Gateway.put( foodData , '/food/changeFoodStatus',function (response) {
        console.log(response);
    });
}

Here is my initial output :

It works like a charm after first time , Actually it doesn't work at first time when food.enableFood is true . ng-change doesn't fire.

How to resolve it?

are you initializing food.enableFood? Also, what happens if you change ng-change to ng-click? Does the function fire? — Vinny, Nov 18 '16 at 16:34
Yes I initialize food.enableFood , I've changed it to ng-click and it fired but its behavior is wrong. — Farzan Najipour, Nov 18 '16 at 16:46

score -1 · Answer 1 · answered Nov 19 '16 at 10:48

I've changed my html to :

                    <div ng-class=" food.status == 1 ? 'text-success' : 'text-danger'" class="pull-left m-t-sm ">
                        <i class="fa fa-circle"></i>
                        <label class="md-switch">
                            <input type="checkbox" ng-true-value="1" ng-false-value="2" ng-model="food.status" ng-change="changeFoodStatus(food.status , food.id)">
                            <i class="blue"></i>
                        </label>
                    </div>

p.s. Thanks @holtc.

Angular - ng-change checkbox doesn't fire for first time

1 Answers1