Ionic 2在頁面打開時向下滾動頁面

我在做一個聊天應用程序。當我打開這個聊天應用程序時，我希望頁面滑落。當框處於焦點時，頁面滑落。但是頁面在第一次打開時不會滑落。我能做什麼？ Chat Page Picture 我的密碼;Ionic 2在頁面打開時向下滾動頁面

ionViewDidEnter() { 
 
    this.chat(); 
 
} 
 
scrollToBottom() { 
 
    if (this.content.scrollToBottom) { 
 
    this.content.scrollToBottom(); 
 
    } 
 
} 
 
onFocus() { 
 
    this.content.resize(); 
 
    this.scrollToBottom(); 
 
    this.keyboard.show(); 
 
}

來源

2017-10-04 Degisim

@suraj歐凱，我加入到答案。謝謝 – Degisim

我從來沒有使用這個屬性還，但根據the docs：

Attr    Type  Details 
------------------------------------------------------------------------------- 
scrollDownOnLoad boolean  If true, the content will scroll down on load.

所以你可以做這樣的：

<ion-content scrollDownOnLoad="true"> 
    <!-- ... --> 
</ion-content>

來源

2017-10-04 12:41:08 sebaferreras

我解決了這個問題 我叫下來滾動功能HTML

<ion-content no-padding> 
 
    <div class="message-wrap" > 
 
     <div *ngFor="let msg of gelenMesajlar; let i = index" class="message" [class.left]=" msg.GONDEREN === 'F' " [class.right]=" msg.GONDEREN === 'C' "> 
 
      <div class="msg-detail"> 
 
       <div class="msg-content"> 
 
        <span class="triangle"></span> 
 
        <span [style.font-size]="'10px'" *ngIf="msg.SIPARISID" [style.text-decoration]="'underline'">Konu #{{ msg.SIPARISID }} numaralı sipariş</span> 
 
        <p class="line-breaker">{{msg.MESAJ}}</p> 
 
        <span *ngIf="msg.SIPARISID" [style.font-size]="'12px'" (tap)="siparisGoruntule(msg.RESIMID, msg.SIPARISDURUMU, msg.SIPARISID)" [style.text-decoration]="'underline'">Siparişi Görüntüle</span> 
 
       </div> 
 

 
      </div> 
 
     </div> 
 
     {{ scrollToBottom() }} <!-- Here it is--> 
 
    </div> 
 
</ion-content>

來源

2017-10-04 13:15:45 Degisim

這個工作是否適合你？根據我的經驗，當所有消息完全呈現時，應該調用'scrollToBottom'函數。有可能會延遲加載消息，在這種情況下，將在呈現消息之前運行'scrollToBottom'。 – Ari

當然，我還有一個問題。有了這段代碼，當我加載消息，然後向上滑動頁面時，它再次將我調低。 @Ari – Degisim

@Degisim你試過我的答案嗎？（我真的很好奇，因爲它是來自內容組件的一個相對較新的屬性） – sebaferreras

Ionic 2在頁面打開時向下滾動頁面

回答

相關問題