My goal is to ensure that an input with a required attribute always has some value, and if left empty, defaults to zero.
<input ng-model='someModel' required>
I have created the following directive:
App.directive('input', function () {
return {
scope: {},
link: function ($scope, $element, $attrs) {
if ($attrs.type == 'number') {
if ($element[0].required) {
$element.on('blur', function(){
if(this.value===''){
this.value=0;
}
});
}
}
}
};
});
I am aware that using this. value directly may not be the best practice as it changes the value and not the scope. However, I am unsure of how to change the scope itself.
Using $scope.value
does not seem to work in this scenario.
I aim for this directive to be as generic as possible without needing to specify the model name in the scope.