循环和动态幻灯片内容使用jquery swiper以角度变化

时间:2018-05-31 11:52:39

标签: angular angular5 swiper

我必须在以角度滑动后更改内容。我在滑动后更改了我的对象值。但它没有在html中重新渲染。任何人都可以帮助我实现它.Below是我的jquery swiper事件

   var mySwiper = new Swiper('.swiper-container', {
      direction: 'horizontal',
      loop: true,
      speed: 700,
      replaceState: true,
      initialSlide: 1,
      centeredSlides: true,
      slidesPerView: 'auto',
      loopedSlides: 2,


      onSlideChangeStart: MoveToNextOrPrevious,
      mousewheelControl: false
    });


  function MoveToNextOrPrevious() {
  if (mySwiper != undefined) {      
 if (mySwiper.swipeDirection == "next") 
   {   self.Navigate('swiperight');
   }
   }
  }

在导航功能中,我更改了我的对象值。但它在html中没有改变

谢谢,

1 个答案:

答案 0 :(得分:1)

这可能与区域有关。在进行更改检测时,Angular在区域中运行,并且第3方库不会自动在角区域内运行。

在构造函数中,您可以注入NgZone,然后使用回调函数调用zone.run

constructor(private zone: NgZone) { }

private MoveToNextOrPrevious() {
  this.zone.run(() => { /* your previous code */ });
}

这应该安排您的代码在角度区域内运行,因此您的更改应该通过更改检测来获取。

更详细地解释了in the docs for NgZone