在angular4.x、5.x中引入第三方库、设全局变量

之前使用的是angularJS 使用第三方库直接应入就可以了，

但4.x/5.x是使用的是TS要在头部文件配置，

在angularJS使用全局变量有$rootScope，4.x/5.x没有

以下是我在项目中使用的方法：

　　直接在 index.html 文件中引入

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Activity</title>
  <base href="/">

  <meta name="viewport" content="width=device-width,initial-scale=2,minimum-scale=0.5,maximum-scale=0.5,user-scalable=no" />
  <link rel="icon" type="image/x-icon" href="favicon.ico">
  
  <script src="assets/js/confing.js"></script>   //自己编写的js文件，
  <script src="assets/js/jquery.min.js"></script>  //引入jq
</head>
<body>
  <app-root></app-root>
</body>
</html>
//confing.js
//link保存全局的请求地址
var link = 'http://192.168.1.49'
var data = [];    //保存全局数据

然后在 typing.d.ts文件中添加说明

declare var module: NodeModule;
declare var link:any;
declare var data:any;
declare var $:any;
declare var jQuery:any;
interface NodeModule {
  id: string;
}

这样就可以在其他组件中使用$、link，

可以在各个组件修改、使用data的数据

posted on 2018-01-08 11:26  飛火~流星  阅读(622)  评论(0)    收藏  举报

导航