Angular cli8使用swiper图片轮播插件实例

1、使用npm安装swiper：

npm install swiper
npm install @types/swiper

2、在angular.json中添加：

// 在build节点中添加css和js
"styles": [
    "./node_modules/swiper/css/swiper.min.css"
],
"scripts": [
    "./node_modules/swiper/js/swiper.min.js"
]

3、组件的具体代码如下：

// 以下为ts文件代码
import {
    Component, OnInit } from '@angular/core';
import Swiper from 'swiper';

@Component({
   
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent implements OnInit {
   
  title = 'swiper01';

  ngOnInit() {
   
    setTimeout(() => {
   
      this.initSwiper();
    }