angular7 wow.js + animate.css

因为需要在原来angular 中做滚动条，元素执行动画， 所以想到wow.js
wow.js 是一个轻量的小型的动画库 。废话不多说

首先： npm 下载
npm install --save wowjs
npm install --save ngx-wow
需要下载两个，上次缺了一个 ngx-wow是基于 wow.js的
附上npm.js中的链接文档：https://www.npmjs.com/package/ngx-wow

下载完毕之后找到

这里面有：
styles : 直接全局搜索就好了

添加： “node_modules/animate.css/animate.css”
“scripts”: [
“node_modules/wowjs/dist/wow.js”
]
将我这个直接复制粘贴 过去

然后来到

import { NgwWowModule } from “ngx-wow” 直接粘贴

imports: [NgwWowModule] 导入这个module

然后再来到

import { NgwWowService } from ‘ngx-wow’;

constructor( private wowService: NgwWowService){
this.wowService.init();
}
this.wowService.init({
boxClass: ‘wow’, //动画元素css类
animateClass: ‘animated’, //基于animate的库
offset: 0, //什么地方触发
mobile: true, //是否兼容移动端，默认是true
live: true //对异步加载的内容执行操作（默认值true）
});
注意：这里可以进行配置
添加上这两段代码 ok~ 这时候可以在任何地方使用了

例子：

clas=”wow“ 必须有，这个是执行动画的基类

data-wow-duration="2s"   要执行动画元素 执行多长时间~ 
 ata-wow-offset="0"     滚动条 滚动到什么位置开始执行~

style=" animation-name: fadeInUp" 必须有这个 没有不好使 动画类型是什么 ~