Javascript swiper滑块中的“下一步”和“上一步”按钮不是wokring

我在两天前发布了同样的问题，但没有收到任何回复 回答这个问题，所以我再次发布这个问题。也许这次我会走运。 我的滑块按钮可以很好地处理静态数据，但它们不能 处理动态数据。无法显示下一个或上一个 幻灯片

我的HTML代码

<section class="browse-cat u-line section-padding">
    <div class="container">
        <div class="row">
            <div class="col-12">

                    <div class="swiper-wrapper">
                        <div class="swiper-slide myreward-slider-item col-md-4" *ngFor="let reward of readableRewards; let i = index">
                            <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 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;
} 

---

你能分享一个你问的前一个问题的链接吗。您是否在控制台中看到任何错误，并且您是否在某个站点上托管了该错误，以便我们进行检查。另一件需要检查的事情是幻灯片是否包含多个项目这里是指向我上一个问题的链接：我没有主持它。如果有帮助的话，我可以分享图片。试着删除按钮的样式并检查它们是否可见。打开devtools并使用按钮类名搜索HTML，以检查这些按钮是否已创建。如果按钮存在，请检查按钮的宽度和高度。还要检查应用于这些按钮的所有计算CSS。您可能还需要检查“图像和观察者”部分下的任何其他属性是否适用于您的情况。您可以找到文档