Объявите директиву AngularJS1 для прописного текста в существующий элемент

Question

Мне нужно создать директиву, которая в верхнем регистре все буквы содержимого элемента

<div>Hello World!</div>

с добавлением заглавных букв

<div all-uppercase>HELLO WORLD!</div>

Моя миссия - понять, как Angular может предоставлять возможность манипулировать текстом в существующий html через "директиву".

Пожалуйста, оставьте рабочий код...

Answer 1

Хотя это можно было легко сделать напрямую через CSS, просто сказав css rule text-transform: uppercase,

Директивная версия будет, как показано ниже. Где вы получаете доступ к элементу текста через link функция, сделайте его прописным и верните его обратно к тексту элемента.

директива

.directive('allUppercase', function(){
  return {
    restrict: 'A',
    link: function(scope, element){
       element.text(element.text().toUpperCase());
    }
  }
});

То же самое может быть достигнуто с помощью углового встроенного фильтра, который называется uppercase

{{ 'Hello World!'| uppercase }}

Демо Всего 3