Angularjs ng-disabled

Question

I have two inputs for validating email and password. I can see individuals of the following works:

myForm.$error.required

validating input form with required input value and

myForm.email.$valid

validating my regex email

If i was to print ie {{ with the above code}} i can see the boolean result of the validation for both input and its correct. However when I use ng-disabled on button with both expression it doesnt work but if i put ng-disable with only one expression I can see it does work but I am unable to place both expression ie

<button type="submit" ng-disabled="myForm.$error.required && !myForm.email.$valid">Sign in</button>

Currently the result becomes true based on the first expression but i thought && meant both condition needs to be met in order to result true ? Could it be because the ouput is true + false = true ?

Answer 1

true + false doesn't mean true && false , it means true || false true || false ,

that's why you don't get the right behavior, so:

<button type="submit" ng-disabled="myForm.$error.required || !myForm.email.$valid">Sign in</button>

Answer 2

You should use ng-disabled="myForm.$invalid" if you want to disable the button while the whole form is invalid.

In case you want to disable the button if the email is not provided or email is not valid so you should use || instead of && so the button will be disabled in both cases.