I have the following code:
<md-list dense>
<md-list-item *ngFor="let message of chatMessages | async">
<p md-line>
<span> {{message.content}} </span>
</p>
</md-list-item>
</md-list>
That outputs this:
My message is c...
instead of:
My message is cool message
How I can show all of the text of each md list item when using <md-list>?
md-list md-list-item [md-line] has the css attributes:
text-overflow: ellipsis
white-space: wrap
This truncates any extra text that doesn't fit in the container. It only displays the ellipsis (...) if the text can't fit in the container.
Either make your container larger, or override with white-space: normal which will wrap any extra text onto additional lines