Angularjs   发布时间:2022-04-20  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了angular – 如何制作可滚动的mat-list大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在尝试使用Angular 4.4.6和Angular Material 2.0.0-beta.12在响应高度容器内构建@L_781_0@mat-list.如何在不溢出父容器的情况下使mat-list可滚动?

这是stackblitz网址:https://stackblitz.com/edit/angular-material2-issue-tedisv?file=app%2Fapp.component.scss

:host{
  border: 3px dashed red;
  width: 100%;
  min-height: 150px;
  max-height: 350px;
  height: 10%;
  display: flex;
  flex-direction: column;
  mat-toolbar {
    flex-grow: 0;
  }
  mat-list {
    flex-grow: 1;
    border: 3px solid green;
  }
}

解决方法

@H_969_9@mat-list { flex-grow: 1; border: 3px solid green; overflow: auto; }

我确定我已经尝试过溢出:auto;昨天(在发布问题之前)并没有奏效.但今天它有效.我可能遇到过与ng cli或浏览器缓存有关的缓存问题.

大佬总结

以上是大佬教程为你收集整理的angular – 如何制作可滚动的mat-list全部内容,希望文章能够帮你解决angular – 如何制作可滚动的mat-list所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。