AngularJS directive to automatically collapse/expand long text

While working on my new portfolio website, I wanted to only show a certain amount of text per project and allow the user to read more if they want. There are many solutions for this using jQuery but it seemed a waste to add jQuery and not utilize AngularJS that the website is already built on top of.

So I created a directive that specifies a length limit and if the paragraph/text crosses it, it is automatically split and a toggle is provided to show more or show less.

I love how simple Angular makes it to create and call such functionality. This is all it takes to add this to any paragraph:

<p data-dd-collapse-text="100">{{veryLongText}}</p>

You can find it in this gist and of course the live demo on my homepage.