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

问题描述 投票:0回答:2

我试图在我的 Angular 应用程序中拥有 Facebook/Twitter 共享功能,但无法解决这个问题。

我阅读了此文档:https://developers.facebook.com/docs/sharing/reference/share-dialog#jssdk

但是后来我的脑海中出现了与这篇 SO 帖子的作者相同的问题:在 Angular 2 中使用 Facebook SDK

但我没有看到任何有效的答案。

所以我只想制作任何工作按钮从那里开始并使用此示例中的代码:https://developers.facebook.com/docs/plugins/share-button/#example

但我什至看不到按钮。有人可以给我提示从哪里开始吗?我什至不知道该问什么。我认为共享功能应该很容易

我的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:

                    <div
                    class="fb-share-button"
                    data-href="http://anything/index.html" 
                    data-layout="button_count">SHARE!!</div>
javascript html angular facebook
2个回答
2
投票

尝试一次

在 Facebook 上分享 -

websiteUrl = '您要分享的网址';

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

在 Twitter 上分享 -

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

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

0
投票
© www.soinside.com 2019 - 2024. All rights reserved.