Angular JS Image validation max size and valid format

Question

I want to show different validation message for maximum size and invalid format in image upload. Here is my code, but max size validation is not working,show only invalid file format validation.

Here is my code.

<div class="group-row col-sm-10 col-sm-push-1">
    <input class="control-set" type="file" ngf-select ng-model="image" name="image" ngf-pattern="'image/*'" ngf-accept="'image/*'" ngf-max-size="5MB" ngf-multiple="false" ngf-min-size='1' ui-jq="filestyle">
    <div ng-show="createUserForm.$submitted || createUserForm.image.$invalid" ng-model="image">
         <span ng-show="createUserForm.image.maxSize" class="text-danger">File must be less than 5 MB.</span>
         <span ng-show="createUserForm.image.$invalid" class="text-danger">Only .jpg,jpeg and .png images are allowed.</span>
    </div>
</div>

What i made mistake here???

Answer 1

Show error using createUserForm.image.$error.maxSize missing $error

<span ng-show="createUserForm.image.$error.maxSize" class="text-danger">File must be less than 5 MB.</span>