angular - ngModelController $formatters won't trigger.

Question

Hey guys i'm having trouble wrapping my head around the ngModelController.

i have this directive:

app.directive('emailValidation', function () {
return {
    restrict: 'A',
    require: 'ngModel',
    link: function (s, e, a, c) {
        c.$parsers.push(function (value) {
            return value.toLowerCase();
        });

        c.$formatters.push(function (value) {
            if (value) {
                return value.toUpperCase();
            }
        });
        s.$watch('user.email', function () {});
    }
};
});

this is. $parsers work! the minute i type input they lowerCase. after that it goes through the validation pipe. DONE! and then as you can see i'm trying to output upper case but the view is still shown as the parser return it

the html looks like this.

<form name='email' novalidate>
<input type='text' 
        name='email' 
        placeholder='email address'
        data-ng-model='user.email' 
        required
        email-validation />
</form>

i'm pretty sure i'm missing something i need to do please help. thanks in advance.