向 Ionic2 的 ion-slides 添加水平滚动条答案

【问题标题】：Adding horizontal scrollbar to Ionic2's ion-slides向 Ionic2 的 ion-slides 添加水平滚动条
【发布时间】：2016-08-03 17:59:47
【问题描述】：

我正在使用 Ionic2 的 ion-slides，这对我来说很好用。

    <ion-slides [options]="extraOptions">
        <ion-slide *ngFor="let slide of slides">
            <img src="{{slide.image}}" />
        </ion-slide>
    </ion-slides>

我想在 Swiper API http://idangero.us/swiper/api/#.V6Lcx8twbqA（第 13 个示例）中添加一个水平滚动条，因为文档提到 Swiper 用于 ion-slides。 source code for that example 在<div class="swiper-wrapper"> 标记之后有<div class="swiper-scrollbar"></div>。

问题是 Ionic 会生成 HTML，所以我该如何添加滚动条功能。

要为滑块添加分页项目符号，我只需在ion-slides 标签中添加pager 属性指令。水平滚动条有类似的东西吗？

【问题讨论】：

标签： angular ionic2 swiper

【解决方案1】：

这不能通过 Ionic 的 ion-slide 组件来完成。请参阅此处一位作者的回复：https://forum.ionicframework.com/t/how-to-add-horizontal-scrollbar-to-slides/59450/3?u=brightpixels

Not at the moment. We've tried to keep the Slides API much simpler than the original Swiper API. But we plan on revisiting this post 2.0 final

我已经通过直接使用 swiper 库并创建自己的组件来解决这个问题。

通过 npm 安装模块：npm install swiper
在组件文件的顶部declare var require
然后var swiper = require('swiper')

【讨论】：

您好先生，您有示例代码来实现 scroll-x 的 swiper 吗？