Invalidating form with custom validation

HTML

<script type="text/javascript" ng:autobind
src="http://code.angularjs.org/0.10.4/angular-0.10.4.js"></script>

<div ng:controller="Ctrl"> 
   
       <ng:form name="userForm">
   
             <input ng:model="itemA" required ng:change="checkVal()">
               <br/>
             <input ng:model="itemB" required ng:change="checkVal()">
               <span>{{ [itemA,itemB].$sum()}}</span>
               <span>{{userForm.$valid}}</span>           
      </ng:form>
</div>

CSS

.ng-invalid {
        border: solid 1px red;
    }

JavaScript

function Ctrl(){
    var scope = this; // used to pass into checkVal
    this.itemA = 10;
    this.itemB = 20;
    this.checkVal = function(value) {
        var total = (scope.itemA * 1) + (scope.itemB * 2); 
        // cheating here since form values are text
        if(total === 100) {
            scope.userForm.$valid = false;
        } else {
            scope.userForm.$valid = true;
        }
    };    
}