angular - 如何以编程方式滚动 MatDialogContent？

Question

我有一个MatDialog(with MatDialogContent)，它比屏幕大，所以会出现竖线。在不成功的提交和所有表单的字段重新验证之后，我想有条件地滚动到该对话框的底部，以显示MatError给用户。如何做到这一点？

Answer 1

我以编程方式在 div 上实现了滚动，但不确定 MatDialogContent 但你可以试一试。

<div #scrollMe style="overflow: scroll; height: xyz;">
    // ...Scroling content
</div>

然后在 component.ts

import {..., ElementRef, ViewChild, OnInit} from 'angular2/core'
@Component({
    ...
})
export class ChannelComponent implements OnInit{

    @ViewChild('scrollMe') private myScrollContainer: ElementRef;

    scrollToBottom(): void {
        try {
            this.myScrollContainer.nativeElement.scrollTop = this.myScrollContainer.nativeElement.scrollHeight;
        } catch(err) {

        }                 
    }

    onError() {
        // Call scroll to bottom when you want to show error at bottom.
        this.scrollToBottom();
    }
}