Uppercase filter not working inside angular translate

Question

I'm trying to display the text of a button in upper-case . There is localisation involved, so the button text will be fetched from the corresponding language files. Language switching works fine , however the upper-case conversion doesn't . If the value of BTN_EDIT is a lower-case text in language file , the text is always shown in lower-case .

 <button ng-click="editUserLoginCreditDetails()" ng-show="editLoginCredentialButton" translate="{{'BTN_EDIT'|uppercase}}"></button> 

Answer 1

The translate directive apparently doesn't allow a filter in that way. Try this:

<button ng-click="editUserLoginCreditDetails()" ng-show="editLoginCredentialButton">{{'BTN_EDIT' | translate | uppercase}}</button>

Answer 2

I know it is too much late, just in case anyone who face this issue. to solve this issue, you have to use css property style="text-transform:lowercase;" and this will solve your problem.

Cheers