diff --git a/components/carousel/carousel.component.spec.ts b/components/carousel/carousel.component.spec.ts
index e8ecbbd0..bb8a762d 100644
--- a/components/carousel/carousel.component.spec.ts
+++ b/components/carousel/carousel.component.spec.ts
@@ -93,6 +93,7 @@ describe('CarouselComponent', () => {
     [infinite]="true"
     [vertical]="true"
     [dragging]="dragging"
+    [selectedIndex]="1"
     (beforeChange)="beforeChange($event)"
     (afterChange)="afterChange($event)"
     >
diff --git a/components/carousel/carousel.component.ts b/components/carousel/carousel.component.ts
index 41e5ccc9..2ac95bd0 100644
--- a/components/carousel/carousel.component.ts
+++ b/components/carousel/carousel.component.ts
@@ -41,6 +41,8 @@ export class CarouselComponent implements AfterViewInit, OnDestroy {
   private _spaceWidth: number = 0;
   private _observer: MutationObserver;
   private _shouldDragging: boolean = true;
+  private _currentSelectedIndex: number = 0;
+  private _selectedIndex: number = 0;
 
   @ContentChildren(CarouselSlideComponent)
   items: QueryList<CarouselSlideComponent>;
@@ -48,8 +50,6 @@ export class CarouselComponent implements AfterViewInit, OnDestroy {
   @Input()
   speed: number = 500;
   @Input()
-  selectedIndex: number = 0;
-  @Input()
   dots: boolean = true;
   @Input()
   vertical: boolean = false;
@@ -73,6 +73,16 @@ export class CarouselComponent implements AfterViewInit, OnDestroy {
   swipeSpeed: number = 12;
   @Input()
   dragging: boolean = true;
+  @Input()
+  get selectedIndex() {
+    return this._selectedIndex;
+  }
+  set selectedIndex(value) {
+    this._selectedIndex = value;
+    if (this._nodeArr.length > 0) {
+      this.carousel(1);
+    }
+  }
   @Output()
   afterChange: EventEmitter<any> = new EventEmitter();
   @Output()
@@ -99,11 +109,12 @@ export class CarouselComponent implements AfterViewInit, OnDestroy {
     };
   }
 
+
   @HostListener('mousemove', ['$event'])
   @HostListener('touchmove', ['$event'])
   panmove(event) {
     event.stopPropagation();
-    if (!this.dragging && !this._isMouseDown) {
+    if (!this.dragging || !this._isMouseDown) {
       return;
     }
     const { direction } = this.swipeDirection(
@@ -113,14 +124,10 @@ export class CarouselComponent implements AfterViewInit, OnDestroy {
       touchEvent.getEventTarget(event).pageY
     );
 
-    if (direction !== 0) {
-      event.preventDefault();
-    }
-
     const length = this.vertical
       ? Math.abs(touchEvent.getEventTarget(event).pageY - this.touchObject.startY)
       : Math.abs(touchEvent.getEventTarget(event).pageX - this.touchObject.startX);
-    const offset = -this.touchObject.direction * length - this.selectedIndex * this._rationWidth;
+    const offset = -this.touchObject.direction * length - this._currentSelectedIndex * this._rationWidth;
     this.touchObject = {
       startX: this.touchObject.startX,
       startY: this.touchObject.startY,
@@ -131,7 +138,7 @@ export class CarouselComponent implements AfterViewInit, OnDestroy {
       offset
     };
     if (direction !== 0) {
-      this.setSlideStyles(this.selectedIndex, this.touchObject.direction);
+      this.setSlideStyles(this._currentSelectedIndex, this.touchObject.direction);
     }
 
     this.getListStyles(offset);
@@ -142,7 +149,8 @@ export class CarouselComponent implements AfterViewInit, OnDestroy {
   @HostListener('touchend', ['$event'])
   panend(event) {
     event.stopPropagation();
-    if (!this.dragging && !this._isMouseDown) {
+    if (!this.dragging || !this._isMouseDown || !this.touchObject.length || this.touchObject.length === undefined) {
+      this._isMouseDown = false;
       return;
     }
     this._isMouseDown = false;
@@ -255,7 +263,7 @@ export class CarouselComponent implements AfterViewInit, OnDestroy {
   getAfterNode(pre) {
     let nextIndex;
     if (pre) {
-      if (this.selectedIndex <= 0) {
+      if (this._currentSelectedIndex <= 0) {
         this.getListStyles(this._rationWidth);
         setTimeout(() => {
           this._nodeArr.forEach((v, tempIndex) => {
@@ -270,10 +278,10 @@ export class CarouselComponent implements AfterViewInit, OnDestroy {
           this.getListStyles(-this._rationWidth * (this.items.length - 1));
         }, this.speed);
         nextIndex = !this.infinite ? null : this._lastIndex;
-        this.beforeChange.emit({ from: this.selectedIndex, to: nextIndex });
+        this.beforeChange.emit({ from: this._currentSelectedIndex, to: nextIndex });
         return nextIndex;
       }
-      nextIndex = this.selectedIndex - 1;
+      nextIndex = this._currentSelectedIndex - 1;
       this.getListStyles(nextIndex * this._rationWidth * this.touchObject.direction);
       this._nodeArr.forEach((v, tempIndex) => {
         if (0 === tempIndex && nextIndex === this._nodeArr.length - 2) {
@@ -281,35 +289,35 @@ export class CarouselComponent implements AfterViewInit, OnDestroy {
           v.top = 0;
         }
       });
-      this.beforeChange.emit({ from: this.selectedIndex, to: nextIndex });
+      this.beforeChange.emit({ from: this._currentSelectedIndex, to: nextIndex });
       return nextIndex;
     } else {
-      if (this.selectedIndex >= this._lastIndex) {
-        this.setSlideStyles(this.selectedIndex, 1);
+      if (this._currentSelectedIndex >= this._lastIndex) {
+        this.setSlideStyles(this._currentSelectedIndex, 1);
         this.getListStyles(-(this._lastIndex + 1) * this._rationWidth);
         nextIndex = !this.infinite ? null : 0;
-        this.beforeChange.emit({ from: this.selectedIndex, to: nextIndex });
+        this.beforeChange.emit({ from: this._currentSelectedIndex, to: nextIndex });
         return nextIndex;
       }
-      nextIndex = this.selectedIndex + 1;
-      this.setSlideStyles(this.selectedIndex, 1);
+      nextIndex = this._currentSelectedIndex + 1;
+      this.setSlideStyles(this._currentSelectedIndex, 1);
       this.getListStyles(-nextIndex * this._rationWidth);
-      this.beforeChange.emit({ from: this.selectedIndex, to: nextIndex });
+      this.beforeChange.emit({ from: this._currentSelectedIndex, to: nextIndex });
       return nextIndex;
     }
   }
 
   caculateDirectionLeftCurrentIndex() {
-    const previousIndex = this.selectedIndex;
-    this.selectedIndex = (previousIndex + 1) % this.items.length;
+    const previousIndex = this._currentSelectedIndex;
+    this._currentSelectedIndex = (previousIndex + 1) % this.items.length;
   }
 
   caculateDirectionRightCurrentIndex() {
-    if (this.selectedIndex === 0) {
-      this.selectedIndex = this.items.length;
+    if (this._currentSelectedIndex === 0) {
+      this._currentSelectedIndex = this.items.length;
     }
-    const previousIndex = this.selectedIndex;
-    this.selectedIndex = (previousIndex - 1) % this.items.length;
+    const previousIndex = this._currentSelectedIndex;
+    this._currentSelectedIndex = (previousIndex - 1) % this.items.length;
   }
 
   gotoCarousel(afterIndex) {
@@ -333,8 +341,8 @@ export class CarouselComponent implements AfterViewInit, OnDestroy {
         this.getListStyles(0);
       }, this.speed);
     }
-    this.selectedIndex = afterIndex;
-    this.afterChange.emit(this.selectedIndex);
+    this._currentSelectedIndex = afterIndex;
+    this.afterChange.emit(this._currentSelectedIndex);
   }
 
   getCurrentIndex() {
@@ -449,7 +457,7 @@ export class CarouselComponent implements AfterViewInit, OnDestroy {
   }
 
   get page() {
-    return this.dots ? this.selectedIndex : 0;
+    return this.dots ? this._currentSelectedIndex : 0;
   }
 
   get pageCount() {
@@ -468,6 +476,9 @@ export class CarouselComponent implements AfterViewInit, OnDestroy {
     });
     this.initCarouselSize();
     const index = this.items.length > 1 ? this.selectedIndex : 0;
+    setTimeout(() => {
+      this._currentSelectedIndex = index;
+    }, 0);
     this.getListStyles(-index * this._rationWidth);
     this.carouselInit(this.items);
     const nativeElement = this._ele.nativeElement;
diff --git a/components/carousel/demo/basic-dynamic.ts b/components/carousel/demo/basic-dynamic.ts
index a0641e9e..8bc60295 100644
--- a/components/carousel/demo/basic-dynamic.ts
+++ b/components/carousel/demo/basic-dynamic.ts
@@ -12,7 +12,7 @@ import { Component } from '@angular/core';
       >
         <CarouselSlide *ngFor="let item of state.data;let i = index" [ngStyle]="{'height': state.imgHeight}">
           <div style="display: inline-block; width: 100%;" [ngStyle]="{'height': state.imgHeight}">
-            <img src="https://zos.alipayobjects.com/rmsportal/{{item}}.png" style="width: 100%;"/>
+            <img src="https://zos.alipayobjects.com/rmsportal/{{item}}.png" style="pointer-events: none; width: 100%;"/>
           </div>
         </CarouselSlide>
       </Carousel>
diff --git a/components/carousel/demo/basic.ts b/components/carousel/demo/basic.ts
index 23838e46..9eaa32a9 100644
--- a/components/carousel/demo/basic.ts
+++ b/components/carousel/demo/basic.ts
@@ -12,7 +12,7 @@ import { Component } from '@angular/core';
     >
       <CarouselSlide *ngFor="let item of state.data">
         <div style="display: inline-block; width: 100%;" [ngStyle]="{'height': state.imgHeight}">
-          <img src="https://zos.alipayobjects.com/rmsportal/{{item}}.png" style="width: 100%;"/>
+          <img src="https://zos.alipayobjects.com/rmsportal/{{item}}.png" style=" pointer-events: none; width: 100%;"/>
         </div>
       </CarouselSlide>
     </Carousel>