1.把js文件放入放到 assets/js/下 ;
2.引入js文件: (例如要使用jq和swiper)
旧版本的angular是在angular-cli.json中配置,
较新版本的angular是在angular.json中配置如下:
方式一;通过下载js,css来引入到项目中
"styles": [
"assets/css/swiper.css",
],
"scripts": [
"assets/js/swiper.js",
]
方式二:通过npm下载安装(npm install swiper --save)
"styles": [
"./node_modules/swiper/dist/css/swiper.min.css"
],
"scripts": [
"./node_modules/swiper/dist/js/swiper.min.js",
"./node_modules/swiper/dist/js/jquery.min.js"
]
//注意:如果通过npm安装还不能使用可能是因为插件是js编写的,不能被angular识别,要想被angular识别还是安装:
//例如jquery: npm install @types/jquery --save-dev
//例如swiper: npm install @types/swiper --save-dev
//例如swiper: npm install @types/bootstrap --save-dev
3.在 typings.d.ts 下新增两句
declare var $: any;
declare var Swiper:any;
//如果没有创建typings.d.ts文件,也可以直接在(例如;
news.component.ts里声明:
import { Component, AfterViewInit,OnInit } from '@angular/core';
//引入jq,就可以直接使用$;
declare var $: any;
//引入swiper
declare var Swiper:any;
@Component({
selector: 'app-home',
templateUrl: './home.component.html',
styleUrls: ['./home.component.css']
})