Question

我正在将html网站迁移到Ionic应用程序中。

html网站使用名为＆＃34; Swiffy＆＃34;：http://www.gstatic.com/swiffy/v5.4/runtime.js

的旧版javascript动画运行时文件

通常这是在旧网站中使用的方式：

1）包括运行时并使用一堆生成的代码声明swiffyObject。

<script type="text/javascript" src="...path/to/swiffy.js"></script>
<script>swiffyobject = {"internedStrings":["::::50g2s..... a bunch of really long code...</script>

2）文档准备好后启动Swiffy对象

$(document).ready(function(){

var stage = new swiffy.Stage(document.getElementById('swiffycontainer'),swiffyobject);
stage.setBackground(null);
stage.start();

....

我试图在一个全新的Ionic 2项目中做同样的事情：

1）在src / index.html

中包含脚本

<script type="text/javascript" src="...path/to/swiffy.js"></script>
<script>swiffyobject = {"internedStrings":["::::50g2s..... a bunch of really long code...</script>

2）在主页ionViewDidLoad中插入脚本：

ionViewDidLoad() {

var stage = new swiffy.Stage(document.getElementById('swiffycontainer'),swiffyobject);
stage.setBackground(null);
stage.start();
}

不幸的是，它不起作用。运行离子发送时，会发生两个错误：

Cannot find name 'swiffy'.
Cannot find name 'swiffyobject'.

我是Angular 2的新手，我很确定主页打字稿文件不知道index.html中声明的全局变量swifft和swiffyobject

我试过了：

var stage = new window["swiffy"].Stage(document.getElementById('swiffycontainer'),window["swiffyobject");
stage.setBackground(null);
stage.start();
}

没有打字稿编译，但它也不起作用，抱怨无法读取属性＆＃39;舞台＆＃39;未定义的

如何获取index.html中声明的变量？

Answer 1

在AppModule文件中声明这些变量

declare let swiffy : any;
declare let swiffyobject: any;

@NgModule({
   //...
})
export class AppModule{}

Answer 2

找不到名字'swiffy'。

找不到名字'swiffyobject'。

为了避免这些错误（因为只是打字稿抱怨对这些类型一无所知），你可以在你想要使用它们的同一组件文件中声明它们，如下所示：

declare var swiffy: any; declare var swiffyobject: any; @Component({...}) ...

这足以让打字稿变得快乐。

但是，另一方面，现在我们应该在控制台中检查是否正在创建这两个属性并由您导入的脚本设置。如果没有设置它们，请检查js库的路径是否正常，并查看该代码以查看是否将属性创建为全局对象。

您导入的脚本的第二行似乎创建了swiffyobject，但我不知道是否也正在创建swiffy脚本。

在Ionic 2项目中导入单个第三方javascript文件时出现Typescript错误

2 个答案: