Angular 8 的 ngx-slick-carousel 问题答案

【问题标题】：ngx-slick-carousel issues with Angular 8Angular 8 的 ngx-slick-carousel 问题
【发布时间】：2020-10-26 03:04:49
【问题描述】：

我在角度 8.2.14 中使用 ngx-slick-carousel，并且在滚动期间我在 2 行中获取图像

这是我的 HTML 代码：

<ngx-slick-carousel class="carousel" #slickModal="slick-carousel" [config]="slideConfig">
      <div ngxSlickItem *ngFor="let slide of slides" class="slide">
        <img src="{{ slide.img }}" alt="" width="100%">
      </div>
    </ngx-slick-carousel>

这是我的 TS 代码：

slides = [
    { img: "../../assets/xd5.jpg" },
    { img: "../../assets/xd5.jpg" },
    { img: "../../assets/xd5.jpg" },
    { img: "../../assets/xd5.jpg" },
    { img: "../../assets/xd5.jpg" },
    { img: "../../assets/xd5.jpg" }
  ];
  slideConfig = { "slidesToShow": 4, "slidesToScroll": 1, "autoplay": true, "centerMode": true };

【问题讨论】：

标签： angular8

【解决方案1】：

首先，您必须使用 npm 安装 slick-carousel，然后将以下行添加到您的 angular.json 文件放入脚本部分

“node_modules/slick-carousel/slick/slick.min.js”

然后你必须添加

"node_modules/slick-carousel/slick/slick.scss",

“node_modules/slick-carousel/slick/slick-theme.scss”

将文件放入 css 部分。

【讨论】：