イオン2ツイッター埋め込みタイムライン問題

Question

私のイオン2アプリでは、Twitter埋め込みタイムラインを使用しようとしています。 これまでのところ、以下のコードがありますが、ユーザーがビューを離れるとタイムラインが消えます。ここに行方不明のものがありますか？

<ion-header> 
<ion-navbar> 
    <button ion-button menuToggle> 
    <ion-icon name="menu"></ion-icon> 
    </button> 
    <ion-title>Social Media</ion-title> 
    </ion-navbar> 
</ion-header> 
<ion-content padding> 
    <a class="twitter-timeline" href="https://twitter.com/hashtag/amyawards2017" data-widget-id="837781109337436160">#amyawards2017 Tweets</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>--> 
</ion-content> 




export class SocialMediaPage{ 
    constructor(public navCtrl: NavController, 
    private loadingCtrl: LoadingController,private toastCtrl: ToastController, 
    private alertCtrl: AlertController, 
    public twitter: TwitterService) { 

    } 

    ngAfterViewInit() { 
      !function(d,s,id){ 
       var js: any, 
        fjs=d.getElementsByTagName(s)[0], 
        p='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"); 
    } 



} 

Answer 1

ngAfterViewInitをこのものに置き換えます。

!function(d,s,id){ 
      var js: any, 
       fjs=d.getElementsByTagName(s)[0], 
       p='https'; 
       js=d.createElement(s); 
       js.id=id; 
       js.src=p+"://platform.twitter.com/widgets.js"; 
       fjs.parentNode.insertBefore(js,fjs); 
     } 
     (document,"script","twitter-wjs"); 

私はそれがあなたのために働くかどうかわかりませんが、私のアプリケーションではうまくいきました。 私はそれがあなたのために働くことを願っています。

Answer 2

ngAfterViewInitをionViewDidEnterに置き換えます。ビューが初期化されるときionViewDidEnterは、ビューがナビゲートされるたびに呼び出されたのに対し、

ionViewDidEnter() { 
    !function(d,s,id){ 
     ... 
    } 
    (document,"script","twitter-wjs"); 
} 

ngAfterViewInitにのみ、このため、あなたが内の異なるコンテンツに切り替える場合は、その

ノート（別のビューから）、と呼ばれています同じページでもこのエラーが発生します（たとえば、ページ上でionic segmentを使用している場合）。

HTML：：

<ion-segment [(ngModel)]="model" (ionChange)="segmentChanged()"> 

TS：

updateTwitter() { 
    !function(d,s,id){ 
     ... 
    } 
    (document,"script","twitter-wjs"); 
} 
segmentChanged() { 
    this.updateTwitter(); 
} 
ionViewDidEnter() { 
    this.updateTwitter(); 
}