https://github.com/ismarslomic/angular-read-more

AngularJS Read More Directive - without jQuery dependency
https://github.com/ismarslomic/angular-read-more

Last synced: 2 months ago
JSON representation

AngularJS Read More Directive - without jQuery dependency

• Host: GitHub
• URL: https://github.com/ismarslomic/angular-read-more
• Owner: ismarslomic
• License: bsd-3-clause
• Created: 2014-12-14T07:14:41.000Z (about 10 years ago)
• Default Branch: master
• Last Pushed: 2019-02-22T16:44:56.000Z (almost 6 years ago)
• Last Synced: 2024-10-12T12:52:36.104Z (3 months ago)
• Language: JavaScript
• Homepage:
• Size: 98.6 KB
• Stars: 66
• Watchers: 9
• Forks: 44
• Open Issues: 12
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# hm-read-more

[![Build Status](https://travis-ci.org/ismarslomic/angular-read-more.svg?branch=master)](https://travis-ci.org/ismarslomic/angular-read-more)

[![Coverage Status](https://coveralls.io/repos/ismarslomic/angular-read-more/badge.svg?branch=master&service=github)](https://coveralls.io/github/ismarslomic/angular-read-more?branch=master)

[![Dependency Status](https://gemnasium.com/ismarslomic/angular-read-more.svg)](https://gemnasium.com/ismarslomic/angular-read-more)

> 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](http://codepen.io/ismarslomic/pen/yYMvrz "Codepen.io: AngularJS Read More Directive")

![AngularJS Read More](angular-read-more.png "AngularJS Read More Directive")

## Install client side

```bash

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

```

Note that [angular-sanitize](https://docs.angularjs.org/api/ngSanitize/service/$sanitize) is required since this directive is allowing HTML tags to be used in text.

## Run example locally

```bash

$ git clone

$ npm install

$ bower install

$ gulp watch

```

## Test locally

```bash

$ git clone

$ npm install

$ bower install

$ gulp karma

```

## How to use in HTML

Include JS script

```html

```

Add the module to your app,

```html

angular.module("app", ["hm.readmore"]);

```

As element

```html

```

As attribute

```html





```


* `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

```bash

gulp bump

gulp build

git add .

git commit -m ""

git push

```

Use Github UI to create new tag and release

## Register bower package for the first time

```bash

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

```