Flexible and easy social sharing directives for Twitter, Google plus and Facebook


4550.0.236 years ago8 years agoMinified + gzip package size for angular-social-links in KB


Angular Social Sharing Links

Flexible and easy social sharing directives for Twitter, Google Plus, Facebook, Pinterest, StumbleUpon, LinkedIn, and Reddit.



bower install angular-social-links


angular.module('myApp', ['socialLinks']);

Angular social links will automatically use the absolute URL of the current page:

<a social-twitter>share on twitter</a>
<a social-twitter status="My custom status">share on twitter</a>
<a social-facebook>share on facebook</a>
<a social-gplus>share on google plus</a>
<a social-pinterest media="">share on pinterest</a>
<a social-linkedin>share on linkedin</a>
<a social-stumbleupon>share on stumbleupon</a>
<a social-reddit>share on reddit</a>
<a social-vk>share on</a>
<a social-ok>share on</a>
<a social-xing>share on xing</a>

but you can define custom URLs too:

<a social-twitter custom-url="">share on twitter</a>
<a social-facebook custom-url="">share on facebook</a>
<a social-gplus custom-url="">share on google plus</a>
<a social-pinterest media="" custom-url="">share on pinterest</a>
<a social-linkedin custom-url="">share on linkedin</a>
<a social-stumbleupon custom-url="">share on stumbleupon</a>
<a social-reddit custom-url="">share on reddit</a>
<a social-vk custom-url="">share on</a>
<a social-ok custom-url="">share on</a>
<a social-xing custom-url="">share on xing</a>

and custom click handlers for all directives:

<a social-twitter custom-handler="$event.preventDefault();controller.doSomething($url)">share on twitter</a>

you could set custom width and height for window:

<a social-twitter social-width="600" social-height="300">share on twitter</a>

You can use $event (click event object) and $url (the share link url). This will prevent the popup window from coming up. If you don't use $event.preventDefault, the link will navigate as usual.


npm install
grunt build



If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from