如何使 md-tab-body 中的 md-list 水平滚动?

Question

我正在将项目列表嵌入到选项卡正文中。由于列表对于屏幕来说太长，我需要滚动到列表的末尾。当我设置 layout="column" 时，我得到了一个垂直列表，滚动条会自动显示。但是当我设置 layout="row" 时(如下面的代码所示(，我的水平列表没有滚动条，我无法水平滚动。所以我无法到达列表的末尾。这是一个错误还是我错过了什么？注意：当我的水平列表没有嵌入到选项卡正文中时，滚动工作得很好。

有人有想法吗？

<md-tabs md-dynamic-height  md-stretch-tabs>
<md-tab>
<md-tab-label class="tab-label">
tab label
</md-tab-label>
<md-tab-body >
<md-list layout="row">
<md-list-item ng-repeat="listitem in listitems"></md-list-item>
</md-list>
</md-tab-body>
</md-tab>

Answer 1

我遇到了类似的问题，其中 md-dynamic-height 不考虑滚动条。尝试指定足够的高度，并查看是否显示滚动条。

Answer 2

我找到了解决方案。如果有人感兴趣：

• 删除动态高度指令

• 指定以下 CSS：

  .tabs-wrapper { 位置：相对; }

  .全尺寸 { 位置：绝对; 顶部： 0; 右：0; 底部： 0; 左： 0; }

  • 在HTML代码中应用CSS：应用于外部div类"tabs-wrapper"，应用于md-tabs类"full-size"