Question

我想在收到新邮件时自动将特定div转到底部。我发现的解决方案只提到了content元素的滚动。

<ion-content class="page mc-page">

    <div class="chatpanel">

        <!--I want to auto scroll .chattxt-w -->
        <div class="chattxt-w" #chattxt>

            <!--load all messages-->
            <div class="wtxt s3 msgitem" text-left *ngFor="let msgs of messages">{{msgs.msg}}</div>
        </div>

    </div>

</ion-content>

Answer 1

您必须使用ViewChild，并在每次收到新邮件时执行滚动底部。你可以这样做：

@Component(...)
export class YourComponent {
    ViewChild('chattxt') chattxt: ElementRef;

    onMessageRevieved(){
      this.chattxt.nativeElement.scrollTop = this.chattxt.nativeElement.scrollHeight
    }
}

希望这有帮助。

Answer 2

<ion-content>

在此处添加您的内容！

</ion-content>

import { Component, ViewChild } from '@angular/core';
import { Content } from 'ionic-angular';

@Component({...})
export class MyPage{


@ViewChild(Content) content: Content;


scrollToTop() {
this.content.scrollToTop();


 }}

我认为这会有所帮助

Ioinc 2 / Angular 2 - 如何滚动底部div？

2 个答案: