我有一个包含mat-toolbar
和cdk-virtual-scroll-viewport
的页面。我想保持mat-toolbar
始终在屏幕上,而cdk-virtual-scroll-viewport
填充屏幕的其余部分。
我尝试将cdk-virtual-scroll-viewport
的高度设置为100vh
,但是,当我到达列表的末尾时,工具栏就消失了。
这是我准备的示例代码:https://stackblitz.com/edit/angular-lbxmce
如您所见,一旦我们滚动到底部的末尾,我们需要滚动回第一个项目,以便再次显示工具栏。如何在保持列表填充屏幕的其余部分的同时修复工具栏的位置?
谢谢。
最佳做法是为您的页面实现布局并将mat-toolbar
添加到布局中。
这是一个例子:
...
const routes: Routes = [
{
path: 'test',
component: TestLayoutComponent,
children: [
{ path: '', component: TestComponent },
]
}
];
@NgModule({
imports: [RouterModule.forChild(routes)],
exports: [RouterModule]
})
export class TestRoutingModule { }