一、现象

在项目的开发中,总会用到一些公司的脚本方法,同时,不希望在每个页面用到时又得需要引用,有点麻烦。

二、解决

1、在src文件夹下新建文件夹 utils;

2、在utils下新建文件 common.js,如:

var common = {

  showInfo: function(name, age){

    // 在控制台上打印出来

    console.log(name);

    console.log(age);

  }

}

3、 同时在utils下也新建对应的文件 common.d.js,如:

declare let common: {
  showInfo: (name: string, age: string) => void;
};

tips: 参数中的类型需要对应写上,具体语法可以参照TypeScript  ;https://www.tslang.cn/docs/handbook/basic-types.html

4、在.angular-cli.json中的scripts处添加common.js 所在的位置,如:

"scripts": [
"utils/common.js"
],

5、在需要调用的页面进行调用 common.showInfo("yang", "18");

三、总结

先认真阅读理解 TypeScript 的基本类型  https://www.tslang.cn/docs/handbook/basic-types.html,

注:common.js修改时或添加时,需要和common.d.ts进行同步处理,第一个参数的类型都需要对应写上,处理完后,重启服务即可生效

angular如何引入公共JS的更多相关文章

  1. Angular中引入外部js的使用方式

    在Angular中我们或许会用到部分外部插件的时候,像Bootstrap,Jquery这些当然我们可以通过Npm安装包的形式引入,但是还有一些其它的js库需要引入的话,我们又应该怎样操作呢? 在这里做 ...

  2. angular项目引用第三方公共js文件

    由于项目需要,领导要求在正在开发的angular项目中,引入公共js,以便进行统计计算. 于是便各种找度娘,网上有好多引用jquery插件的例子,于是便按照步骤对自身项目进行了改造,先记录一下: st ...

  3. vue如何全局引用公共js

    在项目开发中需要调用一些工具类方法,所以需要将公共方法放在公共js中,并且需要全局引用这些公共js 1:创建公共JS(utils.js)  src/common/utils.js export def ...

  4. 一个不错的angular 字体库( 引用js文件就行)

    https://klarsys.github.io/angular-material-icons/ 使用方法: 1.引入这个js文件, <script src="//cdnjs.clo ...

  5. Angular4.0引入laydate.js日期插件方法

    Angular是不支持直接引入js文件的,下面介绍项目如果引入laydate.js的方法 一.将下载的laydate中的js和theme文件放到一个统一的文件下面,我把它放到asset下 二.在ang ...

  6. 基于 Webpack 引入公共库的几种方式

    以 jquery 和其插件 jquery-modal 为例,记录下引入公共库的几种方式. 为了方便,首先安装 jquery 和 jquery-modal: cnpm i jquery jquery-m ...

  7. 【转】VUE 爬坑之旅-- 如何对公共JS,CSS进行统一管理,全局调用

    原文:https://blog.csdn.net/zgh0711/article/details/78664262 vue 中,将页面分为了各个组件,我们写好组件,就可以将这个组件运用到其他各个页面中 ...

  8. 向jsp中引入公共文件

    前沿,在网页开发中,总会存在某几个.js或者某几个.css是所有.jsp文件的公用文件,为了方便引用 我们把这些在公共的.js及.css文件放到一个.jsp文件中,只需要将这个引入所有公共.js及.c ...

  9. vue element-ui怎样提炼一个自己写的js当作公共js

    vue element-ui怎样提炼一个自己写的js当作公共js请教一下各位大神,我刚刚触摸vue element-ui几天,写的一个清晰检索的input框,现在需当作项目公共的部分,可遭需的html ...

随机推荐

  1. iOS应用图标AppIcon

    应用图标需求:(像素px) 29pt:      58*58 ( @2x ) 87*87 ( @3x ) 40pt:      120*120 ( @2x ) 180*180 ( @3x ) 60pt ...

  2. linux 怎么与网络对时

    首先来了解下面几个知识点:1. date命令:#date显示系统时间2.hwclock命令 (即hardwareclock系统硬件时间)#hwclock显示硬件时间#hwclock -w将系统时间写入 ...

  3. C#生成缩略图,C#给图片添加水印

    生成缩略图 #region 生成缩略图 /// <summary> /// 生成缩略图 /// </summary> /// <param name="orig ...

  4. AET PN结

    电场方向 电场方向和正电荷受力方向相同 飘移运动和扩散运动 多子和电场方向互相抵制,而多子是扩散运动,而对少子则是促进作用,当扩散和漂移达到动态平衡时,我们称PN结形成 PN结特性 单项导电性

  5. ASP.NET MVC 3 Application Upgrader

    ASP.NET MVC 3 Application Upgrader: http://aspnet.codeplex.com/releases/view/59008

  6. sql语句的优先级

    SQL 不同于与其他编程语言的最明显特征是处理代码的顺序.在大数编程语言中,代码按编码顺序被处理,但是在SQL语言中,第一个被处理的子句是FROM子句,尽管SELECT语句第一个出现,但是几乎总是最后 ...

  7. ThreadLocal总结

    一.问题抛出 SimpleDateFormat是非线程安全的,在多线程情况下会遇见问题: public static void main(String[] args) { ExecutorServic ...

  8. Linux查看与挂载新磁盘

    问题 把CentOS都换成了Ubuntu Server(16.04 LTS),用df -h查看磁盘占用情况,确发现之前插入的一块大容量磁盘/dev/sdb1消失了.是磁盘坏了?还是没被系统识别? 解决 ...

  9. 每日一练之大整数加法(P1255 数楼梯)

    走楼梯走一步还是两步的问题其实就是斐波那契数列(F(n)=F(n-1)+F(n-2),而在int型范围内存在45个相异的数,题干说明楼梯总数可以为5000,则考虑使用字符串进行存储.当两个数相加产生进 ...

  10. NPOI 修改已存在的excel文件,设置第一行行高

    FileStream fileStream = new FileStream(@FileName, FileMode.Open, FileAccess.Read); FileStream fileSt ...