adding a plus/minus symbol for time zones

[IbraheemAlSaady]

I'm trying to add a plus/minus symbol for a time zone. I've modified the definitions in the config like this

uiMaskConfigProvider.maskDefinitions({'A': /[a-z]/, '*': /[a-zA-Z0-9\+\-\s]/});

and my html looks like this

                  <input type="text"
                         date-time
                         format="HH:mm Z"
                         placeholder="HH:mm +HH:mm"
                         ui-mask="99:99 *99:99"
                         model-view-value="true"
                         min-view="minutes" max-view="hours"
                         auto-close="true"
                         ng-model="date.time">

when I choose the time from the time picker, it's fine, but when I type it manually, it highlights the input with red border. Am I missing on something?