How can I set a character limit for paragraph?

Issue

I currently have <p>{{event.desc}}</p> which gives the entire description of the event.

Some have very long description, and i only want, say, the first 50 characters.

How can this be achieved?

Solution

Try this:

.fifty-chars {
    width: 50ch;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

<p class="fifty-chars">Short event description</p>
<p class="fifty-chars">Long long long long long long long long long 
    long long long long long long long long long long long long long
    long event description</p>

Answered By - Pierre François