需要在ionic 3應用程序頁面中使用小部件

Question

我必須將外部小部件包含在我的離子頁面中。 當我將腳本添加到index.html並在第一次加載頁面（Ex Home.html）中使用小部件html元素但在其他頁面不起作用時，此方法有效。 我已經使用Ionic 3開發了應用程序。我需要在我的應用程序globaldata.html中顯示FXStreet的Economic Calendar Pro小部件。 為此，我已經完成了如下操作，將代碼添加到了src / index.html中

<script type="text/javascript">
        var fxcalendar_config = {
            host: "http://calendar.fxstreet.com",
            css: 'mini',
            rows: 7,
            pastevents: 0,
            hoursbefore: 1,        
            timezone: 'India Standard Time',
            showcountryname: 'true',
            columns: 'date,time,country,event,previous,volatility,actual',
            isfree: 'true',
            countrycode: 'JP:EMU,UK,US',
            culture:'en-US'
        };
    </script>
    <script type="text/javascript" src="http://calendar.fxstreet.com/scripts/mini"></script>

並將以下代碼添加到src / pages / globaldata / globaldata.html中

<ion-grid>
  <ion-row>
    <ion-col>
        <div id="fxst_calendar" class="last-table" style="position: relative; width: 100%; overflow: auto; margin-bottom: 10px;"></div>
    </ion-col>
 </ion-row>
 </ion-grid>

您能否幫助任何人解決此問題。 這適用於ionic 1應用程序，不適用於ionic 3應用程序。

Answer 1

最終，我得到了如下所示的解決方案，該解決方案沒有任何問題。 在頁面的構造函數中，我添加了以下代碼，

let scripttagElement = document.createElement('script');
scripttagElement.src = "http://calendar.fxstreet.com/scripts/mini";
document.body.appendChild(scripttagElement); 

所以在頁面上工作。