NgbCarousel 指令中的动态变化间隔输入属性

Question

我正在尝试制作可以通过用户输入（例如按钮）动态控制速度的旋转木马。我已经按照 ng-bootstrap carousel API but for some reason, I find that the speed of the slides does not change dynamically in response to user input when the carousel is already running, unless I stop and restart the carousel. I used the code below similar to what can be found in ngx-bootstrap dynamic carousel here（我之前使用的）

中的指示将 interval 输入属性作为目标

 <!-- Template carousel.html -->

<ngb-carousel #flash="ngbCarousel" [interval]="speed">
<ng-template ngbSlide>
<img src="https://lorempixel.com/900/500?r=1" alt="Random first slide">
<div class="carousel-caption">
  <h3>First slide label</h3>
  <p>Nulla vitae elit libero, a pharetra augue mollis interdum.</p>
</div>
</ng-template>
<ng-template ngbSlide>
<img src="https://lorempixel.com/900/500?r=2" alt="Random second slide">
<div class="carousel-caption">
  <h3>Second slide label</h3>
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</div>
</ng-template>
  <ng-template ngbSlide>
<img src="https://lorempixel.com/900/500?r=3" alt="Random third slide">
<div class="carousel-caption">
  <h3>Third slide label</h3>
  <p>Praesent commodo cursus magna, vel scelerisque nisl consectetur.</p>
</div>
</ng-template>
</ngb-carousel>


<div>   
<button type="button" (click)="flash.pause()" class="btn btn-warning">
  Pause</button>
<button type="button" (click)="flash.cycle()" class="btn btn-success">
   Start</button>
<input type="number" class="form-control" [(ngModel)]="speed">
</div>

/* Typescript carousel.ts */    

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

@Component({
selector: 'ngbd-carousel-basic',
templateUrl: './carousel.html'
})
export class NgbdCarouselBasic {

 public speed : number;

}

谁能告诉我一个让按钮或表单输入在运行时动态改变旋转木马速度的方法，或者这个功能目前在 ng-bootstrap 中不可能吗？

Answer 1

在当前（从 1.0.0-alpha.28 开始）ng-bootstrap 实施中，除非您暂停/重新启动，否则不会获取动态间隔更改。因此，您所观察到的是当前实施的局限性。

您可以在 https://github.com/ng-bootstrap/ng-bootstrap/issues 中提出问题以请求支持此案例。

NgbCarousel 指令中的动态变化间隔输入 属性

Dynamic changing interval input property in NgbCarousel directive

ng-bootstrap

angular

NgbCarousel 指令中的动态变化间隔输入属性