Javascript “下一步”和“上一步”按钮在Swiper中不起作用

我目前正在研究Angular 8。我用的是滑水器滑块。但是它 未显示“上一步”和“下一步”按钮。下面是我的代码。任何 非常感谢您的帮助。多谢各位

我的HTML代码

   <section class="browse-cat u-line section-padding">
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <div class="category-slider swiper-container">
                        <div class="swiper-wrapper">
                            <div class="swiper-slide myreward-slider-item col-md-4" style="margin-right: 100px;" *ngFor="let reward of readableRewards">
                                <a href="javascript:void(0);">
                                    <div class="myreward-slider-img">
                                        <img
                                        src="{{reward?.Image}}"
                                        class=""
                                        alt="rewards">
                                    </div>
                                </a>
                                <div class="row">
                                    <div class="col-md-6 text-left padding-20">
                                        <span class="text-light-black cat-name"><b>{{reward?.Title}}</b></span>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <!-- Add Arrows -->
                        <div class="swiper-button-next"></div>
                        <div class="swiper-button-prev"></div>
                    </div>
                </div>
            </div>
        </div>
    </section>

.swiper-button-next:after,
.swiper-button-prev:after {
  font-size: 14px;
  font-weight: 900;
  color: #ff0018;
  background: #ff0018;
}

.swiper-button-next {
  right: 10px;
}

.swiper-button-prev {
  left: 10px;
}

.swiper-button-disabled {
  display: none;
}