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

正在页面上工作。

需要在ionic 3应用程序页面中使用小部件

1 个答案: