私は2つの個人間で作成された「最初の」メッセージに無限にスクロールしようとしているIonicアプリで、チャットアプリケーションの機能の最後の部分にいるあなたが使ったアプリ、Facebook、Skype、Slackなど。Ionic 2/4 Infinite Scrollが上向きになっています...下向きではなく、チャットアプリケーション用です。奇妙な間隔と奇妙な行動
私がやっている問題はいくつかあります。私はすべてのメッセージを収容する<ul>
上無限スクロールのコードを追加すると
、私は(私はロードスピナーを考慮するためだと思う)巨大200pxの高さの空白を取得します。ここに私のコードは次のとおりです。
<ion-infinite-scroll (ionInfinite)="scrolled($event)" threshold="10px" position="top"> <ion-infinite-scroll-content></ion-infinite-scroll-content> </ion-infinite-scroll> <ul> <li *ngFor="let message of messages; let i = index"> ... other code to build the message </li> </ul>
私はアイデアは、それが彼の「トップ」無限スクロール領域と、それがために照会することであることで、特定の会話のためだけに最初の10件のメッセージをつかむために私のチャットを設定しています次の10などです。問題は、チャットが読み込まれると、スクロールが画面の最後までスクロールして最後に送信されたメッセージを表示するまでに一時的な一時停止があることです。しかし、その短い瞬間には、スクロール側はすでに
scrolled()
の機能を発動するために<ion-infinite-scroll>
に示すようなページの上部にあります。
他に誰かがこのようなことをしていますか?ページがレンダリングされると、メッセージは非同期に読み込まれるため、<ion-infinite-scroll>
がページの読み込みに失敗するのを防ぐ最良の方法を見つけようとしています。私はここで行方不明の単純なものがありますか?
ありがとうございます! :)
.tsファイルの内容を確認できます –