問題タブ [angular-cdk-virtual-scroll]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
103 参照

javascript - Angular 仮想スクロール: Microsoft SignalR を使用して新しいデータがストリーミングされると、新しい項目を先頭に追加します

現在、データのライブ更新に Microsoft SignalR を使用しています。新しいデータが入ってくるたびに、既存の仮想リストに追加し、そのエントリを元の場所から削除したいと考えています。

基本的に、仮想スクロールでシフトを解除し、リストをリロードせずにそのデータエントリをスプライスするにはどうすればよいですか。

0 投票する
1 に答える
1897 参照

angular - CDK autosize 仮想スクロール戦略でスクロール位置を維持する

CDK autosize 仮想スクロール戦略でスクロール位置を維持する

<cdk-virtual-scroll-viewport autosize>によって提供されたスクロールできるアイテムの大きなリストがあります@angular/cdk-experimental(アイテムには動的な高さがあるため、の代わりにこのスクロール戦略を使用していますFixedSizeVirtualScrollStrategy)。

新しいアイテムは、時間の経過とともにリストに挿入されます。つまり、一番上に追加されます。ユーザーが下にスクロールすると、新しいアイテムがビューポート内のアイテムを押しのけることを避けたいです。したがって、アイテムが追加された後にスクロール位置を維持/復元するメカニズムが必要です。

私は半作業ソリューションを持っています (そしてそれはプライベート フィールドを読み取るのでハッキーです)、アイテムが追加された後、ビューポートはランダムに数ピクセルシフトします。

関連するコード部分は次のとおりです。

ここでこのアプローチのデモを作成しました: https://stackblitz.com/edit/angular-be926g?file=src/app/cdk-virtual-scroll-overview-example.ts

一定のビューポートでこれをシームレスに達成する方法はありますか?