Multiline text field using angular limitTo or slice or filter

I have an HTML field which is supposed to display the first couple of lines of a text message that was sent to/from you most recently, similar to messages on an iphone. I want max two lines of text, the end of the second line is cut off using ellipsis. I can only hold 45 characters per line the way it's formatted. Preferably there would be a way to do word break properly but I haven't found that yet either.

I'm also planning on building this using ionic/cordova so I can't rely on pure css, scss or any other webkit trickery so I'm attempting to do this only using angular. I'm really close but I can't get it.

My solution is essentially taking my messages text, {{message.text}}, and using limitTo or the slice method to take the first 45 characters of the returned array text, then on a second line right below it, the next 45 characters after those first 45.

                <div class="row row-center">
                    <div class="col" style="padding:0px">
                        <div style="">
                        {{ message.text | limitTo: 45 }}<br />
                        {{ message.text.slice(45,90) }}
                        {{ message.text.length > 45 ? '...' : ''}}
                        </div>
                    </div>
                </div>

I understand the problem here, which is that I'm using the same set of results, in the first line I'm getting the first 45, the second line I'm getting the first 90, then from the end I'm taking 46...this doesn't make sense I realize but I feel like I'm close, any guidance appreciated.

EDIT: I think I just figured it out, using slice (changed above)! Now does anyone have an idea about how to do this wordwise?

Why cant you use limitTo:90 (why do you want to use it as 45 twice????) and enable word wrap in the field where the message will be displayed.

use limitTo in your controller like,

$filter('limitTo')(input, limit) 
$filter('limitTo')(message.text, 90) //In your case limit is 90 

In your case , First 45 characters : $filter('limitTo')(message.text, 45) Next 45 characeter : $filter('limitTo')($filter('limitTo')(message.text, 90),-45);

In HTML :

{{message.text | limitTo:45}}
{{message.text | limitTo:90 | limitTo:-45}} //This will fetch first 90 characters and removes first 45 from it giving you next 45 characters