Можно ли улучшить эту угловую директиву?
Я создал директиву с плавающей меткой, которая получает значение существующего заполнителя и помещает его в элемент div, который служит плавающей меткой. Атрибут placeholder удаляется, а тег label скрыт. Директива работает нормально, но меня беспокоит, как она манипулирует DOM. Интересно, есть ли лучший (более чистый) способ: 1) управлять шаблоном для элемента div с плавающей меткой:
var template = '<div class="floating-label">{{ placeholder }}</div>';
//append floating label template
$element.after($compile(template)($scope));
2) найти метку метки по атрибуту for (который связан с входом):
document.querySelector('label[for="' + $scope.id + '"]').style.display = 'none';
Следует отметить, что используется jqLite. (нет JQuery)
Вантуз с директивой
1 ответ
Решение
Выглядит неплохо, всего несколько комментариев:
- Я бы отбросил изолированную область и просто использовал
attrs
параметр; устраняет необходимость в сервисе $compile. - Не требует ngModel
- Подумайте об удалении узла. (Я мог бы пойти в любом случае на этом)
- ссылаться на мои изменения