要解决Angular Material Scroller在选项卡中的高度错误,可以尝试以下解决方法:
import {ScrollingModule} from '@angular/cdk/scrolling';
@NgModule({
imports: [
// ...
ScrollingModule
],
// ...
})
export class YourTabComponent { }
在选项卡组件中,监听选项卡切换事件,并触发Angular Material Scroller的checkViewportSize
方法。
import { Component, AfterViewInit, ViewChild } from '@angular/core';
import { MatTabChangeEvent } from '@angular/material/tabs';
import { CdkVirtualScrollViewport } from '@angular/cdk/scrolling';
@Component({
// ...
})
export class YourTabComponent implements AfterViewInit {
@ViewChild(CdkVirtualScrollViewport) virtualScroll: CdkVirtualScrollViewport;
ngAfterViewInit() {
this.virtualScroll.checkViewportSize();
}
onTabChange(event: MatTabChangeEvent) {
this.virtualScroll.checkViewportSize();
}
}
通过这些解决方法,你应该能够修复Angular Material Scroller在选项卡中的高度错误。