2016-11-13 5 views
0

У меня есть директива, которую я использую, чтобы изменить текст ввода на uppercase, он отлично работает, но теперь я хочу показать текст capitalize, когда пользователь вводит текст, обратите внимание, что я хочу сохранить текст в верхнем регистре, но чтобы показать его пользователю следует капитализировать. Для этого я создал класс css, но я не знаю, как использовать этот css в директиве.Как добавить класс css в директиву?

Как я могу добавить этот класс css в директиву?

попробовав.

CSS

.textCapitalize { 
    text-transform: capitalize; 
} 

Директива

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(); 
      }); 

     } 

    }; 

}); 
+1

Если добавить класс капитализировать, его уже будучи капитализировать. Вы имеете в виду прописное значение модели на заднем плане и не видно пользователю? – Sreekanth

+0

Точно, я хочу, чтобы значение оставалось в верхнем регистре на фоне, но для пользователя значение отображается как заглавное. – FernandoPaiva

ответ

0

Попробуйте это:

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); 

     } 
    }; 
}); 
Смежные вопросы