CODEWITHSUNDEEP
javascriptangularjs
Shane
Shane

Reputation: 558

Angular checkbox first click does nothing if ng-checked is true

So, this seems like it must be a newb question. Here is a plunkr http://plnkr.co/edit/r9xWht5DZtOTvbblXwYZ

<input id="reviews"  ng-model="reviews" type="checkbox" ng-checked="reviews == 1" />

Basically I have a boolean in the db that I set scope to, it is either 1 or 0 in db. If it is true then the checkbox is checked, if not then it isn't. The problem I am having is that if it is checked, the first time 1 uncheck the box, scope doesn't change. When I click it (check it again) the scope value turns into true, then it works as expected.

Again, I must be overlooking something trivial here. I was looking into $scope.$watch should I be using that?

Thanks!

Upvotes: 1

Views: 2043

Answers (2)

Samir Aguiar
Samir Aguiar

Reputation: 2559

Your problem is using ng-checked with ng-model. The documentation says:

Note that this directive should not be used together with ngModel, as this can lead to unexpected behavior.

Both try to set the value of the input field and this leads to the weird results you're having.

Upvotes: 1

logee
logee

Reputation: 5067

Instead of ng-checked you can use ng-true-value and ng-false-value instead.

See plunker

<input id="reviews"  ng-model="reviews" type="checkbox" ng-true-value="1" ng-false-value="0" />

Upvotes: 1

Related Questions