Короткая, но интересная новость: последний релиз Angular, 19.2.0-next.0, представляет поддержку неотмеченных строковых литералов в выражениях, что значительно улучшает гибкость темплейтов.
Ключевые варианты использования:
- Динамическое содержимое:
<p>Сообщение: {{ `Привет, ${name} - ${value} }}</p>- Динамические классы:
<p class="{{ `foo-${postfix} }}">Пользовательский класс</p>
<p [class]=foo-${postfix}>Пользовательский класс</p>- Интерполяции с несколькими выражениями:
<p>С интерполяциями: {{ `Привет ${name}, сейчас ${timeOfDay}! }}</p>- Пайпы и строковые литералы:
<p>С пайпом: {{ `hello ${name} | uppercase }}</p>- Динамические URL:
<img [src]="${base}/600x400`" />- Циклы со строковыми литералами:
@for(n of [1,2,3]; track $index) {<br> <button [attr.data-id]=${n}-button>{{ `Нажми ${n} }}</button>
}Эта новая функциональность упрощает работу с шаблонами, делая код более читаемым и поддерживаемым. На мой взгляд, этого нам не хватало очень давно.
Статья - https://medium.com/netanelbasal/enhancing-angular-templates-with-untagged-template-literals-0baa5b4f8371