当箭头在ng-carousel angular 4中点击时，如何动画从左到右滑动？

Question

当我在style.css中尝试下面的代码时，如果在ngb-carousel angular 4中点击箭头时，如何从左到右动画左右滑动，但每当我点击两个箭头时此动画都朝同一方向工作

.carousel-item {
  /* Force to always be block */
  display: block !important;
  z-index: 1;
  position: absolute;
  transform: translateX(100%);
  opacity: 0;
  transition:all  0.2s;
  visibility: hidden;
  float:right;
}

.carousel-item.active {
  position: relative;
  transform: translateX(0);
  visibility: visible ;
  opacity: 1;
}