Wie fügt man eine Klasse CSS in die Direktive ein?

Question

Ich habe eine Direktive, die ich benutze, um Text einer Eingabe in uppercase zu ändern, es funktioniert gut, aber jetzt möchte ich den Text capitalize zeigen, wenn Benutzer Typ, möchte ich den Text Großbuchstaben zu halten, aber um Benutzer zu zeigen sollte kapitalisieren. Um dies zu tun, habe ich eine CSS-Klasse erstellt, aber ich weiß nicht, wie ich dieses CSS in Direktive verwenden soll.

Wie könnte ich diese CSS-Klasse in Richtlinie hinzufügen?

versuchen.

CSS

.textCapitalize { 
    text-transform: capitalize; 
} 

Richtlinie

var app = angular.module('starter'); 

app.directive('uiUppercase', function(){ 

    return { 
     require:'ngModel', 
     link: function(scope, element, attr, ctrl){   
      element.addClass('textCapitalize'); //show text capitalized 
      var _textFormat = function(input){ 
       return input.length > 0 ? input.toUpperCase() : ""; 
      } 

      element.bind('keyup', function(){ 
       ctrl.$setViewValue(_textFormat(ctrl.$viewValue));    
       ctrl.$render(); 
      }); 

     } 

    }; 

}); 

Answer 1

Try this:

app.directive('uiUppercase', function() { 
    return { 

     restrict: 'A', 
     require: 'ngModel', 

     link: function(scope, element, attr, ctrl) { 

     function addUpperCaseClass(ngModelValue) { 

      if(!element.hasClass("textCapitalize")) 
       element.addClass("textCapitalize"); 
     } 
     ctrl.$parsers.push(addUpperCaseClass); 

     } 
    }; 
});