离子2 Twitter嵌入时间线问题

Question

im试图在我的离子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

用ionviewDidenter替换ngafterviewinit，例如

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

ngafterviewinit仅在初始化视图时才调用，而每次视图将视图导航到（从另一个视图）

时，就会调用IonviewDidenter

请注意，因此，如果您切换到同一页面中的不同内容，您仍然会收到此错误（例如，如果您在页面上使用离子段）。如果是这种情况

html：

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

ts：

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