具有Angular Material动态高度选项卡的可滚动内容元素

Question

这个问题已经提出了Severa的 L T 输入法的进化过程中角料,但我没能做出任何V1.0.5的建议工作.整个页面(或Flex容器)滚动,将选项卡移出视图.

如何实现可滚动的全高内容元素？

<div flex>
    <md-tabs md-dynamic-height md-border-bottom>
        <md-tab label="one">
            <md-content class="md-padding">

演示小提琴

Bonus Karma用于整合自定义滚动条.

Answer 1

我已经解决了.通过删除dynamic-height指令,然后使用绝对定位,它正在工作:

.tabs-wrapper {
    position: relative;
}
.full-size {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

<div ng-app="sandbox">
    <div flex class="tabs-wrapper">
        <md-tabs class="full-size" md-border-bottom>

小提琴演示

需要绝对定位才能使flex元素的子元素扩展.

注意:小提琴演示中的高度不正确.我的项目中不会发生此问题.