无法在具有全高旋转木马引导程序的iOS浏览器上垂直滚动页面

Question

我在移动android的标头中有一个100vh高度的旋转木马滑块引导程序，它工作正常，但在IOS（Chrome和Safari）上，它无法滑动以向下滚动页面（触摸事件位于滑块顶部）。侧向滑动以触发幻灯片过渡效果很好，但向上或向下滑动不会发生页面滚动。 这是我的代码

 <div class="flex container carousel slide col-12 col-md-9 p-img-slide" data-ride="carousel" data-interval="false"
          #carouselImgProduct id="carouselImgProduct" [ngStyle]="{'touch-action': 'pan-y'}" (swipeleft)="prevnextImgClick(true)" (swiperight)="prevnextImgClick(false)">
          <div class="carousel-inner">
            <div class="carousel-item p-img-only" *ngFor="let im of lst; index as i"
              [class.active]="i === indexDisplayImage">
              <img src="{{im}}" alt="{{im}}" />
            </div>
          </div>
          <ol class="carousel-indicators">
            <li data-target="#carouselImgProduct" *ngFor="let im of lst; index as i"
              [attr.data-slide-to]="i" [class.active]="i === 0"></li>
          </ol>
        </div>

任何帮助表示赞赏！谢谢！