Closed Ibni-Amin closed 11 months ago
Thanks for the issue! This issue appears to be a support request. We use this issue tracker exclusively for bug reports and feature requests. Please use our forum for questions about the framework.
Thank you for using Ionic!
Prerequisites
Ionic Framework Version
v7.x
Current Behavior
I am developing chat in ionic with the help of ion-content once I open the chat screen there small data in scroll and i go down into botttom of chat ion-content, after viewDidEnter I get more data but I want to load it using unshift operator when the new, a bit time after scroll jump.
Expected Behavior
I am handling scrolling in chat through ion-content scroll. It shouldn't be jumped , remember there is no jump issue in android and chrome.
Steps to Reproduce
step html `<ion-content [scrollEvents]="true" scrollDownOnLoad="true" lines="none" class="fullScreen" style="height:100% ; width: 103%; overflow: hidden; --padding-end:3%" [ngClass]="dark ? 'dark-mode' : 'light-mode'" (click)="closeAttahment()" (ionScroll)="ionicScroll($event)">
<div *ngFor="let message of chatmessages; let i=index; trackBy: trackByFn">
step
async ionViewDidEnter() { const offSet = (this.offSet += 15); await this.chatHistoryofUser(offSet, 100); // when view load with some initial messages after that i load more messages this.offSet = offSet + 100; }
ionicScroll($e: Event) { const detail = (<CustomEvent>$e).detail; const scrollObj: IScroll = { lastItemsCount: this.lastItems, scrollToTopCount: detail.scrollTop, TimeOut: 1500, }; this.chatService.setSrcroll(scrollObj); // call api and the below for loop execute }
for (let i = 0; i <= res.data.messages.length - 1; ++i) { this.chatmessages.unshift(res.data.messages[i]); }
ts sampleCode Reproduction URL
No response
Ionic Info
Ionic:
Ionic CLI : 7.1.1 (/Users/....../.nvm/versions/node/v18.17.1/lib/node_modules/@ionic/cli) Ionic Framework : @ionic/angular 7.5.0 @angular-devkit/build-angular : 15.2.4 @angular-devkit/schematics : 15.2.10 @angular/cli : 15.2.10 @ionic/angular-toolkit : 10.0.0
Capacitor:
Capacitor CLI : 5.5.0 @capacitor/android : 4.6.1 @capacitor/core : 5.5.0 @capacitor/ios : 4.6.1
Cordova:
Cordova CLI : not installed Cordova Platforms : not available Cordova Plugins : not available
Utility:
cordova-res : 0.15.4 native-run (update available: 2.0.0) : 1.7.3
System:
NodeJS : v18.17.1 (/Users/........../.nvm/versions/node/v18.17.1/bin/node) npm : 9.6.7 OS : macOS Unknown Xcode : Xcode 14.3.1 Build version 14E300c
Additional Information
Anyone help will be appreciated. 😊😊