The reason this happens is because a value of false
gets interpreted as a lack of ngModel
when used with required
. As discussed here, consider this excerpt from the Angular source:
var validator = function(value) {
if (attr.required && (isEmpty(value) || value === false)) {
ctrl.$setValidity('required', false);
If there is a required attribute and its value is false
, it does not pass validation. This is probably intentional for the sake of more easily validating required checkboxes, in which case the default value for unchecked is false
.
It may not need to be this way, considering that checkboxes can take ng-true-value
and ng-false-value
attributes but I guess it was either do this or enforce the use of non-true
and non-false
values for those attributes on every checkbox, and this was the better choice.
One workaround would be to use the strings 'true' and 'false' instead.