为ionic3

Question

我想创建此网址中提到的组件：

https://codepen.io/shaoner/pen/zvvQKr

有人可以帮我吗？

我在离子项目中创建了一个组件选择轮。

select-wheel.html

<div class="select-wheel-container">
  <div class="select-wheel-sel"></div>
  <ion-scroll scrollY="true" #scrollElement>
  <div class="select-wheel-list">
   <div class="select-wheel-item">
  </div>
  <div class="select-wheel-item" *ngFor="let option of options">
    <div [ngClass]="{'active': $index === index}" 
    [attr.data-sectionvalue]="option.value">{{option.label}}</div>
  </div>
  <div class="select-wheel-item">
  </div>
</div>

select-wheel.ts：

 import { Component, Input, ElementRef, Renderer, ViewChild } from 
 '@angular/core';
 @Component({
  selector: 'select-wheel',
  templateUrl: 'select-wheel.html'
 })
 export class SelectWheelComponent {
  oldScrollTop = 0;
  @Input()itemHeight = 0;
  @Input()amplitude = 0;
  @Input()options: any[];
  index = 0;
  @ViewChild('scrollElement') scrollElement: any;

  constructor(private element: ElementRef,private renderer: Renderer) 
  {}
  ngOnInit() {
   // this.scrollElement._scrollContent.nativeElement.scrollTop = 70;
  this.scrollElement.addScrollEventListener(($event) => 
  {
   this.oldScrollTop = Math.round($event.srcElement.scrollTop);
   // this.oldScrollTop = this.oldScrollTop + this.itemHeight;
   const remainder = this.oldScrollTop % this.itemHeight;
   let distance, nearestPos,middle, minDist = 0;
   middle = Math.floor(this.itemHeight / 2);
   console.log(this.oldScrollTop);
   minDist = middle - this.amplitude;
   if(remainder > middle) {
    distance = this.itemHeight - this.amplitude;
    nearestPos = $event.srcElement.scrollTop + distance;
    this.index = Math.floor($event.srcElement.scrollTop / 
     this.itemHeight) + 1;
   } else {
    distance = remainder;
    nearestPos = $event.srcElement.scrollTop - distance;
    this.index = Math.floor($event.srcElement.scrollTop / 
     this.itemHeight);
    }
     console.log(this.index + ',' + nearestPos);
    //$event.srcElement.scrollTop = this.oldScrollTop;
  });
}}

但是我无法获得该网址中提到的预期性能。