Как заставить iScroll работать в приложении Ionic / Angular - PullRequest
Новая
       21

Как заставить iScroll работать в приложении Ionic / Angular

0 голосов
/ 02 января 2019

Исходя из предыдущего поста , у меня есть iScroll для загрузки по крайней мере в мое приложение Ionic.Я делаю это так, как я хочу, чтобы при работе в среде рабочего стола Windows была прокрутка с помощью прокрутки в приложении, где вы просто получаете стандартную прокрутку Windows, а не собственную прокрутку (импульс), как на мобильном устройстве

Простодля тестирования я только что сделал это по старинке, связав скрипт, а затем обнаружив, что IScroll свисает с объекта окна (так как я не мог заставить его работать, импортируя пакет npm.

Так что я скопировалiscroll.js файл в assets и добавление ссылки в index.html .. 

<script type="text/javascript" src="assets/iscroll.js"></script>

Не идеально, но, по крайней мере, это позволяет мне проверить его, чтобы увидеть, будет ли он работать дляme.

Затем у меня есть следующий тестовый код .. 

    import { Component, ViewChild, ElementRef } from '@angular/core';

    @Component({
      selector: 'app-home',
      templateUrl: 'home.page.html',
      styleUrls: ['home.page.scss'],
    })
    export class HomePage {
       public items: Array<string>;
       @ViewChild('wrapper') wrapper : ElementRef;

       constructor() {
          this.items = new Array<string>();
          for(let i = 1; i < 100; i++)
             this.items.push(`Item ${i}`) ;
      }

      public ngAfterViewInit() {
        try {
          let w = window as any;
          var myScroll = new w.IScroll(this.wrapper.nativeElement, {
            mouseWheel: true,
            scrollbars: true
        });
        } catch (error) {
          console.log(error);
        }
      }
    }

с разметкой 

   <ion-header>
      <ion-toolbar>
        <ion-title>
          Ionic Blank
        </ion-title>
      </ion-toolbar>
    </ion-header>

    <!-- <ion-content scroll-y=false> -->
      <div #wrapper>
      <ul>
        <li *ngFor= 'let item of items'>
          {{item}}
        </li>
    </ul>
    </div>
    <!-- </ion-content> -->

Я отлажен в функции построения IScroll и могувижу, что он успешно получает div и применяет к нему различные стили.

Однако я просто не получаю никакой прокрутки. Я отключил ионную прокрутку содержимого и даже удалил tОн управляет контентом, но он все еще не работает.

У меня есть следующая ионная среда .. 

    Ionic:

       ionic (Ionic CLI)             : 4.6.0 (C:\Users\peter\AppData\Roaming\npm\node_modules\ionic)
       Ionic Framework               : @ionic/angular 4.0.0-rc.0
       @angular-devkit/build-angular : 0.11.4
       @angular-devkit/schematics    : 7.1.4
       @angular/cli                  : 7.1.4
       @ionic/angular-toolkit        : 1.2.2

    System:

       NodeJS : v10.15.0 (C:\Program Files\nodejs\node.exe)
       npm    : 6.1.0
       OS     : Windows 10

Кто-нибудь еще пробовал это, или есть идеи, почему это не работает изв приложении Ionic?

Заранее спасибо за любую информацию.

...