Skip to content

Latest commit

 

History

History
83 lines (73 loc) · 2.3 KB

README.md

File metadata and controls

83 lines (73 loc) · 2.3 KB

hm-read-more

Build Status Coverage Status Dependency Status

AngularJS directive that limit text and adds read more / read less links to your text when it exeeds certain limit of characters. No requirements to JQuery. Angular animations are used for fade in/out.

##Codepen demo Codepen demo AngularJS Read More

Install client side

$ bower install angular-read-more --save-dev 

Run example locally

$ git clone
$ npm install
$ bower install
$ gulp watch

Test locally

$ git clone
$ npm install
$ bower install
$ gulp karma

How to use in HTML

Include JS script

<script src="/bower_components/angular-read-more/readmore.min.js"></script>

As element

<hm-read-more
		hm-text="{{ text }}" 
		hm-limit="100" 
		hm-more-text="read more" 
		hm-less-text="read less"
		hm-dots-class="dots"
        hm-link-class="links">
</hm-read-more>

As attribute

<div hm-read-more
		hm-text="{{ text }}" 
		hm-limit="100" 
		hm-more-text="read more" 
		hm-less-text="read less"
		hm-dots-class="dots"
        hm-link-class="links">
</div>
  • hm-text - full text
  • hm-limit - number > 0 of maximum characters before adding "..." and the more/less text. Default: unlimited
  • hm-more-text - link text for read more. Default: Read more
  • hm-less-text - link text for read less. Default: Read less
  • hm-dots-class - css class for dots
  • hm-link-class - css class for links of read more/read less text

##License angular-read-more is licensed under the MIT license.

##Release new Github and Bower version

gulp bump
gulp build
git add .
git commit -m ""
git push

Use Github UI to create new tag and release

bower register angular-read-more git://github.com/ismarslomic/angular-read-more.git