CODEWITHSUNDEEP
angularjsangularjs-ng-repeat
Hitesh Modha
Hitesh Modha

Reputation: 2790

Putting ellipsis (...) after certain number of character in angularjs

I am reading educational data from facebook and showing it to my page directly. I find some string too long so i want to put ... after certain number of character in angularjs.

ex

jeevan sadhana english medium high school 08

to

jeevan sadha..

Upvotes: 5

Views: 6589

Answers (5)

abhishek thakur
abhishek thakur

Reputation: 535

I used these three css stylings and it worked for me:

text-overflow: ellipsis; overflow: hidden; white-space: nowrap;

Also ensure that the width is fixed (in px or %age).

Upvotes: 0

Weshal
Weshal

Reputation: 11

If you want to add ellipses after n number of lines then we can do this using Jquery.dotdot plugin Check this link Adding ellipses after n-bumber of lines in AngularJs

Upvotes: 1

user1760979
user1760979

Reputation:

Create filter in angular code.

Working http://jsfiddle.net/tUyyx/

Use filter code give in fiddle.

Then filter your content like :

{{ name | truncate : 25}}

Upvotes: 3

user1364910
user1364910

Reputation: 

maxLength = 10;
str = str.length > maxLength ? str.substr(0, maxLength) + '...' : str;

Upvotes: 0

zopieux
zopieux

Reputation: 2901

There are two possible solutions.

  • Using pure CSS, use text-overflow: ellipsis; along with overflow: hidden;. Obviously, your element will have to be fixed width.
  • You can use an Angular module such as angular-truncate.

Upvotes: 6

Related Questions