Question

我正在使用bootstrap 4 beta编写一个Angular 4应用程序，我想在用户点击图片时停止旋转木马，因为会有一个模态出现。一旦模态关闭，它就可以恢复旋转木马。我发现的是，当我加载轮播时，如果我更改任何属性并不重要，它就不会绑定到新设置。我的HTML是：

<div #carousel id="carouselControls" class="carousel slide" data-ride="carousel" [attr.data-interval]="interval">
        <div class="carousel-inner" role="listbox">
            <div *ngFor="let image of images, let i = index" class="carousel-item" [ngClass]="{'active' : i == 0}">
                <img data-toggle="modal" data-target="#imageModal" (click)="zoom(image)" [src]="image">
            </div>
        </div>
        <a class="carousel-control-prev" href="#carouselControls" role="button" data-slide="prev">
            <span class="fa fa-chevron-left" aria-hidden="true"></span>
            <span class="sr-only">Previous</span>
        </a>
        <a class="carousel-control-next" href="#carouselControls" role="button" data-slide="next">
            <span class="fa fa-chevron-right" aria-hidden="true"></span>
            <span class="sr-only">Next</span>
        </a>
    </div>

我将组件的interval字段从5000切换为false（布尔值为false），我可以看到，当我调试它时，旋转木马似乎不接受它。那么我的问题是：如何使用Typescript切换它 - 假设它是要走的路？

Answer 1

看来你正在使用基于JS / JQuery的Bootstrap版本。有可能这样做，但图书馆并没有设计成使用Angular的绑定机制。

您可以考虑使用ngx-bootstrap，它是为与Angular进行互操作而编写的Bootstrap库的一个版本，并且确实使用了Angular的绑定机制。

使用Typescript

1 个答案: