Nutella Pancake Machine

    @zomoz/ngx-share
    TypeScript icon, indicating that this package has built-in type declarations

    5.0.0 • Public • Published

    Angular Share Buttons

    Capture

    npm npm Build Status npm

    stackblitz

    Share button directive

    Convert any element to a share button using [shareButton] directive.

    Install with npm

    $ npm install --save @ngx-share/core

    Import ShareModule in your module

    import { ShareModule } from '@ngx-share/core';
    
    @NgModule({
      imports: [
        HttpClientModule,      // (Required) for share counts
        HttpClientJsonpModule, // (Optional) For linkedIn & Tumblr counts
        ShareModule.forRoot()
      ]
    })

    In your template

    <button shareButton="facebook">Share</button>
    <button shareButton="twitter">Tweet</button>
    <button shareButton="pinterest">Pin</button>

    To use the default icons or colors, use ShareButtons service so you can access buttons properties

    import { ShareButtons } from '@ngx-share/core';
    
    @Component({
      // ...
    })
    export class MyComponent {
      constructor(public share: ShareButtons) {
      }
    }

    Now you can set them

    <!--Set color and icon-->
    <button shareButton="twitter" [style.backgroundColor]="share.prop.twitter.color">
      <i [class]="share.prop.twitter.icon"></i>
    </button>
    
    <!--Material example-->
    <button md-icon-button shareButton="telegram" [style.color]="share.prop.telegram.color">
      <i [class]="share.prop.telegram.icon"></i>
    </button>

    Check ShareButton Directive Demo

    Name Default value Description
    [shareButton] null Button name, e.g. 'facebook', 'twitter' ...etc.
    [sbUrl] current URL Sharing link.
    [sbTitle] null Override title meta tag for LinkedIn and Reddit.
    [sbDescription] null Override description meta tag for LinkedIn, WhatsApp, Telegram and Pinterest
    [sbImage] null Override image meta tag for Pinterest only.
    [sbTags] null Override tags for Tumblr and Twitter.
    (sbOpened) button name Stream that emits when share window has opened.
    (sbClosed) button name Stream that emits when share dialog has closed.
    (sbCount) share count Stream that emits share count of the share URL.

    Issues

    If you identify any errors in this component, or have an idea for an improvement, please open an issue. I am excited to see what the community thinks of this project, and I would love your input!

    Support

    npm

    Author

    Murhaf Sousli

    License

    More plugins from the author

    Install

    npm i @zomoz/ngx-share

    DownloadsWeekly Downloads

    2

    Version

    5.0.0

    License

    MIT

    Last publish

    Collaborators

    • micafego
    • testica
    • jcao02
    • zomoz-admin