一、现象

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

二、解决

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. 对map集合按照value从大到小进行排序

    概述: 基本特点: 该集合存储键值对,而且要保证键的惟一性 子类: |--HashTable 底层是哈希数据表结构,不可以使用Null作为键或者值:该集合线程是同步的 |--hashMap   底层是 ...

  2. java 基础排序算法

    冒泡: 从左往右依次比较相邻的两个数,将小数放在前面,大数放在后面. public void bobSort(){        for(int i=0;i<length-1;i++){//排序 ...

  3. Google推出了Python最牛逼的编辑器

    环境配置对于大多数人来说都是拦路虎,我们小白往往不知道: 怎么正确的安装 不知道选择什么 怎么安装常用的第三方库 ... Google推出了一个在线的网站 https://colab.research ...

  4. Oracle根据主键获取对应表,Oracle根据外键获取相关表

    Oracle根据主键获取对应表 select * from user_constraints a, USER_CONS_COLUMNS b where a.CONSTRAINT_TYPE = 'P' ...

  5. 模拟登录,发送amf类型数据

    参考 http://blog.csdn.net/amandag/article/details/5666219 以及 稍微修改了一下AMFPost的类     一.登录 登录过程中主要用到标红的3个请 ...

  6. Jmeter之数据库性能测试

    公司的**产品急待上线,但查询订单操作响应很慢,为了准确定位问题,特对几个大数据查询语句进行性能测试. 环境介绍:数据库用的MYSQL,采用分布式布置,本次单压测一台数据库服务器,查询待支付订单.待消 ...

  7. DRF框架之视图方法的几个封装好的模块介绍(第三天)

    1.DRF框架给我们封装好了好多层模块的 来实现简便接口的编写 # from rest_framework.mixins import CreateModelMixin, UpdateModelMix ...

  8. Spring事务实现分析

    一.Spring声明式事务用法 1.在spring配置文件中配置事务管理器 <bean id="baseDataSource" class="com.alibaba ...

  9. Java就业班day09_xml&tomcat

    Xml & Tomcat Xml eXtendsible markup language 可扩展的标记语言 XML 有什么用? 可以用来保存数据 可以用来做配置文件 数据传输载体 定义xml ...

  10. Java使用BigDecimal计算保留位数不对问题定位

    在项目中使用BigDecimal计算将单位从B换成TB时,算出来的结果总是整数,而没有保留设置的2位小数: 计算代码如下: db.divide(oneTB, ROUND_HALF_UP).setSca ...