По-моему нужно как-то так.
<body ng-controller="ctrl">
<label>FirstVal: </label>
<input ng-model="FirstVal" spinner>
<br>
<label>SecondVal:</label>
<input ng-model="SecondVal" spinner>
<br>
Result: {{result}}
</body>
var MyModule = angular.module('MyModule', []);
function ctrl($scope, numberFilter) {
$scope.FirstVal = 3000;
$scope.SecondVal = 2000;
$scope.result = $scope.FirstVal + $scope.SecondVal;
}
MyModule.directive('spinner', function (numberFilter) {
return {
restrict: 'A',
require : 'ngModel',
link: function (scope, element, attrs, ngModelCtrl) {
$(function(){
element.spinner({
min: 0,
max: 10000,
step: 1000,
spin: function( event, ui ) {
ngModelCtrl.$setViewValue(ui.value);
scope.result = scope.FirstVal + scope.SecondVal;
scope.$apply();
}
});
});
}
};
});
http://jsbin.com/AVeTini/3/edit
И почитайте на досуге чем AngularJS от jQuery отличается.
http://stackoverflow.com/questions/14994391/how-do-i-think-in-angularjs-if-i-have-a-jquery-background 
