В моем Angular компоненте у меня есть текст, состоящий из двух значений. В моем шаблоне:
<svg-icon [name]="someName" class="d-inline-block"></svg-icon>
<strong class="any">
{{ program.name }}
<span class="pcr">{{ program.pcr }}</span>
</strong>
Что я хочу сделать, это обрезать текст с помощью elipsis (...), но особым образом.
Когда недостаточно места для весь текст для отображения, я хочу сначала усечь program.name. Уменьшая размер экрана, можно сократить текст до 5 символов (за исключением многоточия). Если места все еще недостаточно, я хочу усечь program.prc.
. Я попытался создать директиву, используя Hostbinding, но не знаю, как подойти к логи c. Может быть, есть какое-то готовое решение для подобных проблем? Кто-нибудь может помочь?