Angular 角度隐藏导航箭头

在以下情况下，我需要在旋转木马中隐藏导航箭头： 首先，您需要在第一张幻灯片上隐藏上一个导航箭头，然后 最后当您在最后一张幻灯片上时，需要隐藏前进导航箭头。 它现在已经开始工作了。我的问题是当我把视频和图像结合起来的时候。由于上一个和前一个导航箭头是分开的，如何隐藏它们

请看这个链接

代码

<div [ngClass]="{'first': myCarousel?.activeId == '0', 'last': myCarousel?.activeId == imageUrls.length - 1}">
    <!-- {{ myCarousel?.activeId }} -->

    <ngb-carousel #myCarousel [showNavigationArrows]="imageUrls.length > 1 || videoUrls.length > 1" [showNavigationIndicators]="false" interval="0">
        <ng-template ngbSlide *ngFor="let url of imageUrls; let i = index" [id]="i">
            <img class="active" [src]="url" />
          </ng-template>
            <ng-template ngbSlide *ngFor="let url of videoUrls; let i2 = index" [id]="i2">
                <video class="active" [src]="url" controls></video>
            </ng-template>
    </ngb-carousel>

</div>

---

使用css尝试这样做

:ng-deep .carousel-control-next-icon, .carousel-control-prev-icon {
  display: none !important;
}

---

您可以选择其中的

max

length

在.ts文件中

max(x,y):Number{
    return Math.max(x,y);
}

然后

[ngClass]="{'first': myCarousel?.activeId == '0', 'last': myCarousel?.activeId == max(imageUrls.length,videoUrls.length)-1}

css

---

我对css没有问题。我已经拿到了。我的问题是隐藏在光标上的视频和图像一起。我已经隐藏了光标，但问题出在以下代码上[ngClass]=“{'first'：myCarousel？.activeId='0'，'last'：myCarousel？.activeId==imageUrls.length-1}”。您必须调整此代码，因为它仅适用于图像或视频，而不适用于图像和视频重叠的两者。请查看我的stackblitz。我已将其编辑为您的答案。我认为这是因为相同的模板id尝试此：

它仍然不工作。添加多个图像/视频时。一些图像/视频没有出现-从stackblitz示例的运行情况来看，我没有看到任何丢失的图像或视频。现在的问题是prev和forward箭头。在第一张幻灯片上，首先需要隐藏上一个导航箭头，最后需要隐藏前进导航箭头

::ng-deep .first .carousel-control-prev{
    display:none !important;
}
::ng-deep .last .carousel-control-next {
    display: none !important;
}