javascript - ngModel 中的字母数字值在 AngularJS 中输出为大写

Question

我有一个带有输入字段的表单。一个输入字段允许输入字母数字值。但如果该值包含字母，则字母必须为大写。我该如何实现这种方法？是否可以在输入字段中定义它，当用户输入时，字母会自动显示为大写？

View :

<div class="form-group-sm has-feedback">
  <label class="control-label" for="article-id">Article Nr.</label>
  <input type="text" 
         class="form-control" 
         name="Article" 
         id="article-id"
         ng-model="selected.article" 
         ng-pattern="/^[a-zA-Z]{2}[a-zA-Z\d]{9}[0-9]$/"
         ng-required="true"
         />
</div>
...
//the other inputs are the same definition

用大写字母将值保存在数据库中对我来说很重要。

Answer 1

只需创建一个简单的指令，这个答案是基于这里的答案 : Angular.js: How to autocapitalize an input field?.

myApp.directive('capitalize', function() {
   return {
     require: 'ngModel',
     link: function(scope, element, attrs, modelCtrl) {
        var capitalize = function(inputValue) {
           if(inputValue == undefined) inputValue = '';
           var capitalized = inputValue.toUpperCase();
           if(capitalized !== inputValue) {
              modelCtrl.$setViewValue(capitalized);
              modelCtrl.$render();
            }         
            return capitalized;
         }
         modelCtrl.$parsers.push(capitalize);
         capitalize(scope[attrs.ngModel]);  // capitalize initial value
     }
   };
});

HTML 类似 -

<input type="text" ng-model="name" capitalize>