无法在ngx-bootstrap的Carousel组件上动态更改每张幻灯片的项目

<carousel>
  <slide *ngFor="let slide of slides">
    <img [src]="slide.image" alt="Slide">
    <div class="carousel-caption">
      <h3>{{ slide.title }}</h3>
      <p>{{ slide.description }}</p>
    </div>
  </slide>
</carousel>

import { Component } from '@angular/core';

@Component({
  selector: 'app-carousel',
  templateUrl: './carousel.component.html',
  styleUrls: ['./carousel.component.css']
})
export class CarouselComponent {
  slides: any[] = [
    { image: 'slide1.jpg', title: 'Slide 1', description: 'This is slide 1' },
    { image: 'slide2.jpg', title: 'Slide 2', description: 'This is slide 2' },
    { image: 'slide3.jpg', title: 'Slide 3', description: 'This is slide 3' }
  ];

  // Function to update slide content
  updateSlideContent(index: number, image: string, title: string, description: string) {
    this.slides[index] = { image, title, description };
  }
}