###前提・実現したいこと
Angularで作っているWebアプリケーションにTwitterボタンを配置しようとしています。
ボタンは以下で生成したコードをそのまま使っています。
https://about.twitter.com/ja/resources/buttons#tweet
###発生している問題・エラーメッセージ
ボタンではなく"Tweet"というリンクで表示されます。クリックすれば正しく動作はします。
###該当のソースコード
Quickstart Seedをcloneしてapp.component.tsのtemplate
にTwitterボタンのコードをそのまま貼り付けています。
https://github.com/angular/quickstart
ts
1import { Component } from '@angular/core'; 2 3@Component({ 4 selector: 'my-app', 5 template: `<a href="https://twitter.com/share" class="twitter-share-button">Tweet</a> <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>`, 6}) 7export class AppComponent { name = 'Angular'; }
###試したこと
- Component内ではなくindex.htmlにコードを貼ると正常にボタンの形で表示されます。
- ボタンのコードの
<script>
タグをindex.htmlの<head>
や<body>
に移動しても表示はボタンではなくリンクになります
###補足情報(言語/FW/ツール等のバージョンなど)
- TypeScript
- Angular 4.0.1
- Chrome / Firefox / Edge
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2017/04/01 11:54