Angular - Unable to $setValidity (is not a function) - angularjs

Question

I have an angular app linked to a Rails a backend.
What I want is to handle Rails validation errors with Angular.
Based on differents tutorials, I did this:
edit.html
<div id="Wrapper" ng-controller="EditCtrl"
<div class="row margin-top-100">
<form name="form">
<div>
<!--- FIELD -->
<input class="field" type="text" ng-blur="update()" ng-model="current.title" name="title">
</div>
</form>
</div>
</div>
edit.js
.controller('EditCtrl',
function($scope, $rootScope, $state, $stateParams, $http, CurrentSpot, $filter, Notification, $modal,$compile, $timeout){
$scope.update = function() {
$http.put('/c/'+$scope.current.id.$oid, {c: $scope.current})
.then(function(success) {
$scope.current = success.data;
Notification.success("Great !")
}, function(error) {
console.log(error)
form.title.$setValidity('server', false);
console.log("FORM", form.title)
})
}
})
Which produces this error form.title.$setValidity is not a function in the console when Rails refused the update.
Maybe one more information: console.log("FORM", form) returns:
<input class="field ng-pristine ng-untouched ng-valid ng-not-empty" type="text" ng-blur="update()" ng-model="current.title" name="title" >
but {{form.title}} in the view returns:
{
"$viewValue":"Cc",
"$modelValue":"Cc",
"$validators":{
},
"$asyncValidators":{
},
"$parsers":[
],
"$formatters":[
null
],
"$viewChangeListeners":[
],
"$untouched":true,
"$touched":false,
"$pristine":true,
"$dirty":false,
"$valid":true,
"$invalid":false,
"$error":{
},
"$name":"title",
"$options":null
}
After many hours of reading tutorials and documentations, I'm not able to find where the problem comes from.
Thanks

Answer 1

When you call the function as form.title.$setValidity('server', false);, form return DOM object, not an Angular object with $-named methods.
Angular creates a object in the $scope for the named form.
Check JSFiddle and take a look at the browser console.