Question

我对猫头鹰传送带有一些动态变化方面的问题，例如载玻片的数量等。换句话说，传送带在经过一些变化后很容易断裂。

我的方法是重新加载/刷新轮播-但是如何？

我在网上发现您必须按班级刷新它：

$owl.trigger('refresh.owl.carousel');

但是如何将其翻译为Angular / Typescipt？

Answer 1

因此，只要您使用ngx-owl-carousel（遵循您的评论），您的实现就会如下所示。

// component template

<owl-carousel [items]="images" #owlElement>
     <div class="item" *ngFor="let image of images;let i = index">
         <div class="thumbnail-image" [ngStyle]="{'background': 'url('abc.jpg')no-repeat scroll center center / 80px 80px'}"></div>
     </div>
 </owl-carousel>

请注意owlElement模板变量

然后，如果您要处理或触发某些操作，则可以引用此元素

// Component class

import {OwlCarousel} from 'ngx-owl-carousel';

export class HomeComponent {

@ViewChild('owlElement') owlElement: OwlCarousel

   refresh() {
     this.owlElement.refresh()
   }
}

您可以使用方法触发器（trigger(action: string, options?: any[])）从original documentation调用所需的任何事件。

刷新Angular中的猫头鹰轮播

1 个答案: