Я использую плагин, который автоматически усекает длинный текст, когда помечает div ключевым словом ellipsis:
<div style="height: 65px; width: 100px; text-align: center;" ellipsis> {{modelName}}</div>
рассчитывается в браузере, чтобы стать
:
<div style="height: 65px; width: 100px; text-align: center;" ellipsis>
<div class="ngx-ellipsis-inner">
modelName that is too long so it s trun....
</div>
</div>
Мне нужен значок / изображение перед названием модели; вот так:
*I am centered* [icon]modelName *I am centered*
*I am centered* [icon]modelName that is too long so it s trun.... *I am centered*
Плагин с многоточием не может обрабатывать изображения, кроме текста, поэтому я должен обойти его и не могу поместить изображение / значок непосредственно в div.
Я попытался расположить изображение / значок (img [src] = "icon") с помощью float: left; рядом с ним, но не удалось, так как, если имя модели короткое, между ними есть некоторое неудобное пространство:
[icon] *unwanted space* shortModelName *wanted space*
Я подумал, может быть, с помощью CSS и что-то в этом роде:
.ngx-ellipsis-inner::before{
content: url({{icon}});
}
но также не смог заставить его работать. Решение attr (), которое многие люди, похоже, используют, к сожалению, не работает в моем случае, так как я не могу напрямую получить доступ к ngx-ellipsis-inner div.
Было бы здорово, если бы у sb была идея !! Thx:)