angular7中wow.js的使用

ngx-wow地址

• https://tinesoft.github.io/ngx-wow/doc/index.html
• https://www.npmjs.com/package/ngx-wow

首先安装依赖项， wow.js

npm install --save wowjs

在angular.json中引入animate.css和wow.js

"styles": ["src/styles.scss","src/assets/iconfont/iconfont.css","node_modules/swiper/dist/css/swiper.min.css","node_modules/animate.css/animate.css"],"scripts": ["node_modules/swiper/dist/js/swiper.min.js","node_modules/wowjs/dist/wow.js"],

安装ngx-wow

npm install --save ngx-wow

在需要的模块中导入NgwWowModule 模块

// company-profile.module.ts
import { NgwWowModule } from 'ngx-wow';imports: [CommonModule,CompanyProfileRoutingModule,SharedModule,NgwWowModule]

依赖注入并初始化

导入模块后，您可以使用NgwWowService组件中的（即AppComponent）通过调用触发显示动画，init()或者在显示元素时通过WOW通知。

import { NgwWowService } from 'ngx-wow';
ngOnInit() {this.wow.init();
}

初始化和引入模块，可以直接在app模块中进行导入和初始化

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！