一、现象

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

二、解决

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. 用自己的话简要阐述struts2的执行流程

    Struts 2框架本身大致可以分为3个部分:核心控制器FilterDispatcher.业务控制器Action和用户实现的企业业务逻辑组件.核心控制器FilterDispatcher是Struts ...

  2. LinkedHashMap和TreeMap的有序性

    做一个数组的多属性动态排序的功能,使用map时发现有序性问题. LinkedHashMap会存储数据的插入顺序,是进入时有序:TreeMap则是默认key升序,是进入后有序(hashMap .hash ...

  3. omniPlan密匙

    密钥所有者都是youliyuan.OmniPlan 3:HOMJ-QOJH-OIBN-TNIH-HWUN-TEEH-WUNNKWO-HVKB-JAZE-UIHH-XAVY-BEEX-AVYBCRW-M ...

  4. 同一台windows下配置安装多个mysql实例,实现主从同步

    一.安装多个mysql 参见: https://blog.csdn.net/wrh_csdn/article/details/80198795 https://www.cnblogs.com/qjoa ...

  5. Jmeter5.1.1构造https请求

    1.打开浏览器,输入https的网址 2.点开浏览器前面的小锁 3.点开证书.详细信息.复制到文件 把证书保存到本地电脑 4.利用jdk中的keytool.exe工具,重新生成证书 C:\Java\j ...

  6. nginx优化php-fpm优化 压力测试达到每分150万访问量webbench网站压力

    webbench最多可以模拟3万个并发连接去测试网站的负载能力,个人感觉要比Apache自带的ab压力测试工具好,安装使用也特别方便. 1.适用系统:Linux 2.编译安装:引用wget http: ...

  7. SqlServer查询表名的备注(查询表名描述 MS_Description)

    查询表名描述 MS_Description ? 1 2 3 4 5 SELECT tbs.name 表名,ds.value 描述       FROM sys.extended_properties ...

  8. ES6你不知道的let关键字及变量的提升

    一.JavaScript变量创建到访问赋值的过程 创建 create/declare 初始化 initialize 赋值 assign 1.函数的提升 // 函数这种变量声明,首先会创建变量,再初始化 ...

  9. del_cursor 批量删除游标

    declare   cursor [del_cursor] is select a.*, a.rowid row_id from [table_name] a order by a.rowid;   ...

  10. python 多进程/多线程/协程 同步异步

    这篇主要是对概念的理解: 1.异步和多线程区别:二者不是一个同等关系,异步是最终目的,多线程只是我们实现异步的一种手段.异步是当一个调用请求发送给被调用者,而调用者不用等待其结果的返回而可以做其它的事 ...