angular引入 jquery.wave.js
发布时间:2020-12-17 08:25:19 所属栏目:安全 来源:网络整理
导读:jquery.wave.js需要jquery和tweenMax的支持,首先 我们要引入jquery angular引入jquery基本来说有二种方式 第一种 直接在index中引入jquery的cdn index.html script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js" / script 在
jquery.wave.js需要jquery和tweenMax的支持,首先 我们要引入jquery angular引入jquery基本来说有二种方式 第一种直接在index中引入jquery的cdn <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
在组件中声明一下就可以用了 import { Component } from '@angular/core';
declare var jquery:any;
declare var $ :any;
@Component({
selector: 'app-root',templateUrl: './app.component.html',styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'abgular 4 with jquery';
toggleTitle(){
$('.title').slideToggle(); //
}
}
第二种这里有篇图文解释的很不错咯 npm install jquery --save
npm install --save-dev @types/jquery
.angular-cli.json "apps": [{
...
"scripts": [
"../node_modules/jquery/dist/jquery.min.js",],...
}]
使用的时候在ts文件中写入 declare var jquery:any; // not required
declare var $ :any; // not required
或者 import * as $ from 'jquery';
回到正题,现在我们需要应用第三方插件jquery.wave.js,将源码直接粘贴到assets/js/jquery.wave.js就可以了,但是由于里面还用到了tweenMax,我们就必须将tweenMax写到angular-cli.json中了,而不能通过import的形式导入。 "scripts": ["../node_modules/jquery/dist/jquery.min.js","../node_modules/_gsap@1.20.4@gsap/src/minified/TweenMax.min.js","assets/js/wave.js"],
这样就可以正常使用了 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |