简体   繁体   English

Angular中如何实现分享到facebook/twitter的功能

[英]How to implement sharing to facebook/twitter functionality in Angular

I am trying to have a fb/twitter share functionality in my angular app, but can't get my head around this.我正在尝试在我的 angular 应用程序中使用 fb/twitter 共享功能,但无法解决这个问题。

I read this documentation: https://developers.facebook.com/docs/sharing/reference/share-dialog#jssdk我读了这个文档: https://developers.facebook.com/docs/sharing/reference/share-dialog#jssdk

But then I had the same questions in my head like the author of this SO post: Using Facebook SDK in Angular 2但后来我脑子里有同样的问题,就像这篇 SO 帖子的作者一样: 在 Angular 中使用 Facebook SDK 2

Yet I don't see any working answer.但是我没有看到任何有效的答案。

So I just wanted to make any working button to start from there and used code from this example: https://developers.facebook.com/docs/plugins/share-button/#example所以我只想让任何工作按钮从那里开始并使用这个例子中的代码: https://developers.facebook.com/docs/plugins/share-button/#example

But I can't even see the button.但我什至看不到按钮。 Can some give me a hint where to start?有人可以提示我从哪里开始吗? I don't even know what to ask.我什至不知道该问什么。 I thought sharing functionality should be easy我认为共享功能应该很容易

my index.html:我的 index.html:

    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta property="og:url" content="http://anything/index.html" />
    <meta property="og:type" content="website" />
    <meta property="og:title" content="Your Website Title" />
    <meta property="og:description" content="Your description" />
    <meta property="og:image" content="https://www.your-domain.com/path/image.jpg" />

</head>
<body>
    <div id="fb-root"></div>
    <script>
        (function (d, s, id) {
            var js,
                fjs = d.getElementsByTagName(s)[0];
            if (d.getElementById(id)) return;
            js = d.createElement(s);
            js.id = id;
            js.src = 'https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v3.0';
            fjs.parentNode.insertBefore(js, fjs);
        })(document, 'script', 'facebook-jssdk');
    </script>

myComponent.component.ts:我的组件.component.ts:

                    <div
                    class="fb-share-button"
                    data-href="http://anything/index.html" 
                    data-layout="button_count">SHARE!!</div>

Try this once试试这个

To Share On Facebook -分享到 Facebook -

websiteUrl = 'The URL you want to share'; websiteUrl = '你要分享的URL';

<button type="button" data-href="websiteUrl"><a target="_blank" href="https://www.facebook.com/sharer/sharer.php?u={{websiteUrl}}&amp;src=sdkpreparse">Facebook</a></button> 
 

To Share On Twitter -分享到 Twitter -

<button><a href="https://twitter.com/intent/tweet?text=text goes here {{websiteUrl}}&hashtags=hashtag1,hashtag2" target="_blank">Twitter</a>
</button>                                           
             

OR或者

<button><a href="http://twitter.com/share?text=text goes here&url={{websiteUrl}}&hashtags=hashtag1,hashtag2,hashtag3" target="_blank">Twitter</a>
</button>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM