Теги используются в составе Tag list в полях ввода для обозначения выбранных значений: Select Multiple, Tag autocomplete, Tag input

Цвет

Неактивное состояние

Иконка

Используйте kbqTagPrefix и kbqTagSuffix, чтобы явно расположить контент до или после текста тега. kbqTagRemove и kbqTagEditSubmit уже являются suffix-контролами: не комбинируйте их с kbqTagSuffix, поскольку эта директива подключается через их hostDirectives.

Длинный текст

Текст в тегах не переносится на новую строку и обрезается многоточием при превышении доступного пространства.

Удаление

Тег можно удалить несколькими способами:

• Клик по иконке удаления (директива kbqTagRemove) внутри тега.
• Нажатие клавиши Delete или Backspace.
• Программное удаление через API компонента.

Опция удаления настраивается при помощи атрибута removable (по умолчанию включена). Тег, который нельзя удалить, потому что removable выключен или тег неактивен, не показывает иконку удаления.

Выбор

Тег можно выбрать несколькими способами:

• Клик по тегу или установка фокуса на него.
• Space при фокусе на теге.
• Программный выбор через API компонента.

Опция выбора настраивается при помощи атрибута selectable (по умолчанию выключена).

Редактирование

Для включения режима редактирования необходимо установить свойство editable для kbq-tag.

Вход в режим:

• При двойном клике по тегу.
• При нажатии клавиши Enter или F2 (при фокусе на теге).

Сохранение изменений:

• При нажатии клавиши Enter.
• При нажатии на кнопку подтверждения (директива kbqTagEditSubmit).

Отмена изменений:

• При нажатии клавиши Escape.
• При потере фокуса.

Валидация при редактировании

Не используйте редактирование тегов, когда предполагается сложная валидация. Редактирование настроено таким образом, что невозможно сохранить тег с некорректным значением. Для предотвращения сохранения используйте атрибут preventEditSubmit.

Рекомендации

Используйте Badge, если нужно создать цветной маркер в таблице или списке ключ-значение. Теги используются только в качестве токенов внутри контролов.

Навигация с клавиатуры

Фокус на теге

Режим редактирования тега